Skip to main content
Styling Buttons

Customize buttons and save styles for a consistent look across your site. Learn how to add links to the buttons.

Jozef Pokrivcak avatar
Written by Jozef Pokrivcak
Updated over 3 months ago

To edit a button, click on the button directly on the canvas and go to the right-side panel. You’ll find the following options:

Adding links to Buttons

Choose the destination for your button from the dropdown menu:

  • Page: Link to a different page within your website project.

  • Link: Direct to an external URL.

  • File: Link to a file in the assets library.

  • Anchor: Link to a specific section within your current website. To set this up:

    1. Add an anchor ID to the desired block by selecting the block, finding “Anchor ID” in the right-side panel, and entering an ID.

    2. Return to the button, select “Anchor” from the dropdown, and choose the appropriate Anchor ID.

Decide whether the link should open in a new tab or not.

Button Styles

You can customize styles for three button states:

  • Default

  • Hover

  • Active

Save these styles for future use. For details on saving styles, refer to our Style guide.

For each state, adjust the following settings:

  • Corners: Modify the roundness of the button corners.

  • Width: Set the button width.

  • Text Style: Edit or apply a preset text style. Learn more about Styling text in this article.

  • Background Color: Choose the button’s background color.

  • Text Color: Set the color of the button text.

  • Icon: Add an icon to the button.

  • Padding, Margin, Stroke, and Box Shadow: Adjust these settings as detailed in our article.

  • Text Shadow: Add and edit text shadow, and save it for future use.

Did this answer your question?