Creating a New Style Kit

You can always create from scratch and create a new Style Kit or use one of the provided Style Kits from the Library as a starting point. In both cases, you interact with the Style Kits Sidebar, where you will find all the related controls. Any tweaks that you make to the values of these style controls will be stored in your Style Kit, and can be recalled on any page or globally.

After the introduction of Theme Style in Elementor, each page associated with Elementor editor by default has a Theme Style Kit assigned to it. So you might want to reset it before creating a new Style Kit. Check this article on how to reset a Theme Style Kit.


Let's say that you decide to set default typography sizes, edit the colors, and the button styles. 

When setting up a Style Kit, it is always helpful to drop some elements into your layout so you can see the effect right away. For example, when you are editing the Typographic sizes, make sure that you have some instances of the Heading or Text widget in your page with a typographic size selected.

As soon as you make the changes to these controls and you are happy with the result, go to the Theme Style Kit section from Style Kits panel.

You will then get a popup that prompts you to enter a name for your new Style kit.

After you Save, your page will have the new Style Kit assigned. From now on, the Style kit will be available in the dropdown. 

Good job. You have now created a new Style Kit. Let's see how you can update this Style kit with any future changes.

Updating the Style Kit

At some point, you will definitely want to make changes to any of the Styles that you have defined in your Style Kit. Let's say for example that you want to reduce the font size of your Heading Sizes, throughout your entire website.

Go to the Theme Style Kit editor and once you have done your desired changes, clicking on the Update button at the very bottom updates the current Style Kit right away.

After the update succeeds, you'll get a notification slide at the very bottom alerting you for the

If you are updating the Global Style kit, then the changes will naturally take effect site-wide.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us