Design 01 · Custom CSS

Style anything
with your CSS.

Write custom CSS for a page right inside Elementor, with no child theme or extra plugin.

.hero-title {
  background: linear-gradient(90deg, #7C3AED, #DB2777);
  -webkit-background-clip: text;
  color: transparent;
}

Design 02 · Where Code Runs

Head, footer
or both.

Choose exactly where each snippet is printed so it loads at the right moment.

Header scripts

Load analytics, fonts or meta tags in the page head.

Footer scripts

Add chat widgets and tracking pixels before the closing body tag.

Per page

Code runs only on the page where you add it.

Design 03 · Custom JS

Add interactivity
with JavaScript.

Drop in tracking codes, small interactions or third-party embeds in seconds.

document.addEventListener(‘DOMContentLoaded’, () => {
  console.log(‘Hello from Atomic Addons!’);
});