Advanced Custom CSS for Elementor

plugin banner

Advanced Custom CSS for Elementor.

Author:Akash Patel (profile at wordpress.org)
WordPress version required:6.3
WordPress version tested:6.8.3
Plugin version:1.0
Added to WordPress repository:19-11-2025
Last updated:19-11-2025
Rating, %:100
Rated by:1
Plugin URI:
Total downloads:125
plugin download
Click to start download

Advanced Custom CSS for Elementor (ACCE) adds a dedicated Custom CSS section to the Advanced tab of every Elementor widget.
It lets you write clean, widget-scoped CSS using the selector keyword and provides separate fields for Desktop, Tablet, and Mobile styling.

No premium version required — works with both Elementor Free and Elementor Pro.

Perfect for users and developers who need fast, responsive CSS control directly inside the Elementor editor.

Features

  • Adds a Custom CSS panel to all Elementor widgets.
  • Separate CSS fields for Desktop, Tablet, and Mobile.
  • Supports the selector keyword for precise widget-only CSS.
  • Uses Elementor’s live preview for instant visual updates.
  • Breakpoints can be customized with a simple filter.
  • Lightweight, fast, and requires no additional settings.

Usage

In Elementor editor:

  1. Select any widget.
  2. Open the Advanced tab.
  3. Scroll down to ACCE Custom CSS.
  4. Add your CSS using the selector keyword.

Example:

selector {
background: #f3f3f3;
border-radius: 8px;
}

Developer Notes

You can override the default breakpoints (Tablet: 768px, Mobile: 425px) using this filter:

add_filter(‘ACCE_custom_css_breakpoints’, function($defaults) {
return [
‘tablet’ => 900,
‘mobile’ => 600,
];
});

License

This plugin is licensed under the GPLv2 or later.

Screenshots
FAQ
ChangeLog