Elementor Site Settings

Summary: Achieve a unified look across your entire website using Elementor’s Site Settings panel. Easily manage global colors, fonts, and other design tokens to maintain visual consistency.

Master Your Design with Elementor Site Settings in Keystone

The Elementor Site Settings panel centralizes your entire site’s design configuration, giving you full control over layout, colors, typography, and more — all from one place. Whether you’re adjusting fonts, colors, or general layout preferences, this panel streamlines your workflow and ensures consistency across your entire website.

---

Accessing the Site Settings Panel

1. Edit any page with Elementor.
2. Click the hamburger menu icon (☰) in the upper-left corner of the Elementor widget panel.
3. Select Site Settings from the menu.

Every global design setting you apply here will be reflected site-wide.

---

Global Design System Overview

Elementor organizes global settings into three main categories:

• Global Colors – Set universal color values like Primary, Secondary, Text, and Accent.
• Global Fonts – Define consistent typography across your entire site.
• Theme Builder Settings – Customize site-wide styles for Typography, Buttons, Images, and Form Fields.
• User Preferences – Control Site Identity (logo, favicon), Layout, Background, and Lightbox behavior.

---

Setting Global Colors

Colors are key to visual branding, and Elementor lets you standardize them using Global Colors.

To update a global color:

1. Open the Site Settings panel.
2. Click on Global Colors.
3. Locate the color label (e.g., Primary under System Colors).
4. Click the color swatch to open the color picker.
5. Enter a HEX code or choose a new color.
6. Close the panel — the changes apply across your entire site.

---

Setting Global Fonts

Maintaining consistent typography improves user experience and visual appeal.

To update a global font:

1. Open the Site Settings panel.
2. Click on Global Fonts.
3. Find the font label (e.g., Primary under System Fonts).
4. Click the pencil icon beside it.
5. Adjust settings like font family, size, weight, and line height in the Typography panel.
6. Close the menu to apply changes globally.

---

Pro Tip:

Any change you make to a Global Color or Global Font will instantly affect all elements using that style across your website. This keeps your design consistent and saves you hours of manual edits.

By taking advantage of Elementor’s Site Settings through Keystone, you can ensure your website maintains a polished, cohesive, and professional design — all from one control panel.

Stay consistent. Design smart.