The template is built using Color Variables, meaning that you can easily edit a color to be updated site-wide.
- Go to the Variables Panel and click the base collection.
- Customize the color values and names.
Each component in this template has a clear purpose and can be easily customized to fit your needs.
The Components can easily be updated to reflect your branding. To edit:
- Go to the Symbol Panel and double-click the component.
- Customize the logo, links, and hover states through the Style Panel.
The template comes with a complete Style Guide that includes all predefined elements like headings, buttons, and form inputs. Use it to keep your design consistent by following these steps:
- Go to the Style Guide page to view and update the global styles.
- Adjust typography and spacing, and your changes will automatically apply throughout the template.
This template features advanced interactions that add movement and bring your site to life.
Certain elements have scroll-triggered animations that make elements fade in or move as you scroll.
- To edit: Select the section with the animation and go to the Interactions Panel to edit the scroll effects.
Buttons and cards have hover effects that change their appearance when users interact with them.
- To edit: Select the element, and in the Style Panel, toggle the hover state to customize colors, borders, or shadow effects.
