If you’re building a WordPress site with Elementor Free, you might notice that the built-in icon options are limited. In Elementor Pro, you get the option to upload custom icon libraries—but in the free version, things are trickier. Don’t worry! There are a few clever ways to expand your icon choices without paying for Pro or slowing down your site with too many plugins.
1. Use Skyboot Custom Icons for Elementor
Skyboot Custom Icons is a free plugin that adds a huge library of icons directly to Elementor Free.
How it works:
- Installs multiple icon sets, including FontAwesome, LineAwesome, Themify, and more.
- Integrates with Elementor widgets that use icons (like Buttons, Icon Boxes, and Social Icons).
- Lets you pick icons inside Elementor just like you would in Pro.
Pros:
- Works with Elementor Free
- 14,300+ icons available
- Fully customizable (size, color, hover effects)
Cons:
- Only works in Elementor widgets that support icons
- Cannot add completely new libraries beyond what Skyboot provides
2. Add Custom Icons Using HTML or SVG
If you want total control over the icons you use, you can bypass plugins like Skyboot entirely.
Step 1: Choose your icon library
- FontAwesome, Remix Icons, Material Icons, or any SVG pack
Step 2: Enqueue the library
- Use a plugin like Fluent Snippets to add custom code to your header:
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
Step 3: Add icons in Elementor
- Use an HTML widget and insert the icon with an
<i>tag or SVG code:
<i class="fas fa-star"></i>
- Style with Elementor’s custom CSS panel or inline styles
Pros:
- Full control over which icons you load
- No extra plugin for icon management
Cons:
- Slightly more technical than just clicking in Elementor
3. Tips for a Lean Elementor Setup
Too many addons can slow down your site. Here’s a recommended plugin setup:
| Purpose | Plugin |
|---|---|
| Page Builder | Elementor Free |
| Custom Widgets & Templates | RTMKit Free |
| Icons | Skyboot Custom Icons (or use HTML/SVG method) |
| Forms | MetForm Free |
| Cache & Optimization | LiteSpeed Cache |
| Code Snippets | Fluent Snippets |
This setup keeps your site fast while giving you access to all essential features.
4. Conclusion
Even with Elementor Free, you can use thousands of icons, either with Skyboot Custom Icons or by adding your own libraries with HTML and CSS. The key is to avoid plugin bloat and choose solutions that give you flexibility without slowing down your site.