Let's talk about some art.

A utility template to help you set up your typography and button styles using the Style Kits panel.

This is Heading 1 This is Heading 1This is Heading 1

Go to the Style Kit panel, and manage the whole typography on this layout via a number of useful controls. You can also set up your Buttons and Column Gaps. 

This is Heading 2

Text heading 1

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Try experimenting with the Heading sizes, for example if you tweak the Heading 2 value, the heading title above this text must change accordingly. 

Keep in mind that individual element styles override the Style Kit values, so for Style Kits to work, the element must not have manually added styles.

This is Heading 3

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

This is Heading 4

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
This is Heading 5
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
This is Heading 6
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Button Styles

In the Style kits panel you also have controls for the Elementor buttons, and specifically for each of their five sizes. This helps you to consistently manage the styles of your buttons. 

Try dropping a new button widget here, and turn it into a different size. You should see that each size can have a completely different size.

I am a Heading 2, in case you wonder.

Scroll to Top