In web design, using global fonts and colors is a crucial strategy. Not only does it improve the overall visual experience, but it also helps strengthen your brand identity. In this article, we’ll explain why using global fonts and colors is essential and guide you on how to set them up in Elementor.
Why Use Global Fonts and Colors?
- Consistency Across the Site
- Maintaining consistent fonts and colors across different pages or sections helps create a professional, cohesive visual experience. If fonts and colors are inconsistent, users may get confused, negatively affecting user experience and retention.
- Enhance Brand Recognition
- Using uniform brand colors and fonts strengthens your brand identity. When users encounter consistent design elements across various pages, they associate them more easily with your brand. This enhanced recognition fosters trust with your audience, leading to increased brand influence and conversion rates.
- Increase Design Efficiency
- Manually adjusting fonts and colors can be time-consuming and error-prone in the design process. By using global settings, you can streamline the workflow. Designers only need to set the global fonts and colors once, and these styles will automatically apply to all pages moving forward.
Accessing Global Fonts on Your Website
To view the global fonts used on your site in Elementor:
- In the Elementor editor, go to Site Settings. The Site Settings panel will open.
- Click on Global Fonts. A list of global fonts will appear, showing different font types used across your site.
- Note: To view font previews on the canvas, plugin users must activate the preview feature from the WordPress dashboard.
Editing Global Fonts
To edit global fonts:
- Under Custom Fonts, hover over the edit icon.
- To delete a global font, click the delete icon. (Note: You cannot delete system fonts.)
- To reorder the global fonts, click the arrow icon.
- To change font typography, click the edit icon.
- After making your changes, click Save Changes.
Changing the Name of a Global Font
To change the name of a global font:
- Click on the worldwide font name.
- Enter the new name for the global font.
Adding New Global Fonts
To add a new global font:
- Click Add Style. A “New Item” box will appear.
- Enter the new font’s name.
The Importance of Global Color Settings
In addition to global fonts, maintaining consistent colors is equally essential. A unified color scheme enhances visual appeal and strengthens brand recognition through color association.
In Elementor, you can easily set global colors for your website, including text, background, and link colors. Once you’ve established your primary and secondary color palette, all pages will follow these color settings, ensuring consistency in design and minimizing visual conflicts between page elements.