Apply Custom CSS Styling

You can apply custom CSS styling to any supported element in your site.

Step 1 | Add the global.css file

The way that you add the global.css file depends on the IDE you’re using.

Editor (Wix Studio)

1. Go to the Page Code section of the code panel.
2. In the CSS section, click + Add global.css.

Wix IDE or your local IDE

Add a global.css file to the src/styles folder.

Step 2 | (Optional) Add a custom class to your site

In addition to the available classes you can add a new class to any supported element.

You can add new custom classes with code or with the editor:

Code

Add one or more classes to the element with the add() function:

Editor (Wix Studio)

1. Select an element.

2. In the CSS Classes panel, type your custom class in the Custom classes field:

   

Step 3 | Apply custom styles to your class

In the global.css file add custom CSS styles to apply.

For example:

See also

• About CSS styling
• For specific examples of available classes, refer to the API documentation.
• For further information on CSS styling options, refer to the MDN CSS reference docs.
• Wix Studio webinar: Enhance your designs with CSS editing