Updated 1 year 1 month ago
Add as many buttons styles as you need to fit your needs. Button Styles can be applied to all theme-related button elements: Button, ActionBox, Grid, Pricing Table, Contact Form.
Click on a Button preview to expand its settings:
How to add a new Button Style? #
Click the corresponding icon, it appears under the list of the buttons:
How to remove Button Style? #
Click on the corresponding icon when hovering over the button preview:
The Default style, first in the list, can't be deleted this style used by 3rd party plugins, such as contact forms submit buttons.
Button Style Name #
Set the desired name for a particular button style, it appears as a text on a button preview
Colors / Colors on hover #
Apply colors set to match your design
Shadow /Shadow on hover #
Apply a shadow and set its size, it depends on button Font Size value.
Choose which font family will be applied to all buttons, it takes values from the Typography tab.
Text Styles #
Choose whether your button's text will be uppercase or italic.
Font Weight #
Set a font weight for all buttons.
Letter Spacing #
Set letter-spacing (distance between the letters), it depends on button Font Size value.
Hover Style #
Select which effect will be applied to buttons when you hover over them.
Relative Height #
Depends on Font Size, 0.8em means 0.8 times the font size if the font size is 16px, the height will be 16 * 0.8 = 12.8px
Relative Width #
Depends on Font Size, 1.8em means 1.8 times the font size if the font size is 16px, the width will be 16 * 1.8 = 28.8px
Corners Radius #
Depends on Font Size, 0.3em means 0.3 times the font size if the font size is 16px, the radius will be 16 * 0.3 = 4.8px
Border Width #
Set the button border width.