BLACK FRIDAY: 50% OFF all Pro plans Code: BLACKFRIDAY50
Pro from $10 a year or $30 lifetime, no code needed: Code: BLACKFRIDAY50
Ends Cyber Monday, 30 Nov. Lock in the price today. Code: BLACKFRIDAY50
Get 50% Off
Guide

Custom Icons Pro

How to set up and use Custom Icons in Bright Addons Pro.

Custom Icons in Bright Addons Pro turns your own SVG files into icon sets. Each set is a new tab in the Elementor icon library, and the icons take the color and size of the icon control, like any icon font.

Part of: Bright Addons Pro. Before you start: Bright Addons Pro and your SVG icon files.

Set it up

  1. Go to Bright Addons Pro > Custom Icons and click Add Icon Set.

  2. Type the set name, for example Brand Icons.

  3. Choose your SVG files in Add SVG icons and click Publish.

  4. In Elementor, open any icon control, click Icon Library and pick the tab with your set's name.

  5. Set the color and size of the icon in the widget as usual.

Content options

Icons

Option What it does
Add SVG icons Choose one or more SVG files, up to 200 KB each, up to 500 icons per set.
Delete Tick icons and click Update to remove them.
Bright Addons Pro

Unlock this and 90+ more Pro widgets

One license gives you every Pro widget, all 10 extensions, the Theme Builder and priority support. From $10 a year, with a 14-day money-back guarantee.

Tips

  • Single-color icons work best, because each icon is filled with the icon color.

  • Give your SVG files clear names, like arrow-right.svg; they become the icon names.

  • Icons are stored in your uploads folder, so they move with your site.

Questions and answers

Is uploading SVG files safe?

Yes. Only administrators can upload, and every SVG is cleaned before it is stored: scripts, event handlers and outside links are removed.

Can icons have several colors?

No. Each icon is filled with the color of the icon control, like an icon font.

Do I need Elementor Pro?

No. Custom Icons works with the free Elementor and Bright Addons Pro.

Need more help?

Check the troubleshooting guide, or contact support with the page address and what you expected to happen.

Troubleshooting guide
All guides