help center

Search
Close this search box.
On this page

CSS classes in Elementor

Last Update: January 14, 2024

Classes let you combine several different elements so that you can apply one style to them without having to code every element separately. 

How to create a simple CSS class

Elementor greatly simplifies creating CSS classes.

To add elements to a class:

  1. Select an element
  2. In the panel, open the Advanced tab.
    For CSS classes article the advanced tab CSS classes in Elementor 1
  3. In the CSS Classes field, enter a CSS class name. 

Note: When creating a class, do NOT add a period before the class name.

  1. Repeat for every element you want to include in the class.

Example: Alex wants to create a site where every week they can change the color of select text. When building the site, Alex labels all the text elements they want to change with the CSS Class – “change-color”.  In Site Settings, Alex adds the CSS:
.change-color {
    color: green;
}

Now, every time Alex wants to change the color of these elements, they just have to replace green with their selected color.

Related articles

Have more questions? We’re more than happy to assist.

Link is copied to clipboard!
On this page

Is this article helpful?

Share this article

Stuck?
Our Elementor Expert is Ready

Book a 45-min video consultation call with an Elementor expert and elevate your site!