Website elementsMedia & showcase
Icon library
An icon picker, built into your site with no plugin and no library. One glyph from Font Awesome Free, inlined as a single SVG at build. No icon font, no CSS sprite, no client-side JavaScript.
Icon-only button:
labelnames it. This button's whole accessible name is "Delete", even though there is no visible text.Decorative next to its own text (no
label), but with a nativetitletooltip.
Showing 200 of 2,606 icons.
Need a different look? Every icon here also comes in thin, light, sharp and duotone styles in a Superhero build. Browse the full Pro set at fontawesome.com/search and send us the name.
You'll need to give us
- Which icons you want, and whereDescribe them in words, such as a phone beside the number. We match them from Font Awesome Free.
Send these with your request and we can start straight away. Everything else is ours to do.
Find the icon, copy its name, put it in a request — it arrives as one crisp inline SVG, not a 300 KB font.
Also called
Font Awesomeicon pickericon searchBeaver Builder iconUABB iconElementor icon widgetSVG icon
What it replaces
- Font Awesome as a web font (the whole set on every page)
- icon fonts
- page-builder icon modules
Good for
A glyph next to text, in a button, or standing alone: navigation, feature lists, contact details, social links, icon-only buttons (with `label` set).
Not for
Illustrations and logos — an icon is a glyph, not artwork. And any Pro-only style or glyph: ask for it by name and we license and embed it directly in that site, never here.
Accessibility
Written so the page works for every visitor, whether they browse with a mouse, a keyboard or a screen reader, and whether or not they have asked for less motion.
- Decorative by default: no `label` means `aria-hidden="true"`, because most icons sit beside text that already says what they mean.
- With `label`, the icon gets `role="img"` and that exact text as its accessible name — set it whenever the icon is the only content conveying meaning, such as an icon-only button.
- `focusable="false"` always, so the SVG never becomes a stray tab stop in Safari or older Edge.
- An unknown `name` or `style` fails the build, with the three nearest names by edit distance, rather than shipping a blank icon.
Where it's live
- superherotech.ai: /elements/icon/ (gallery)
How to ask for it
“The icon on our home page, with …”
Name it, say which page and which part of the page it goes on, and say what goes in it: your photos, your words, your colors. That is a complete request. We build it, you approve it, and it goes live. If you know it by another name, from WordPress or from another site, that works too.
More elements you can ask for: Before / After, Particle field, Mega menu, Video background, Parallax band, Scroll reveal, Business hours, News ticker, Flip box, Instagram feed, Accordion / FAQ, Card slider, Tabs, Info list, Video player, Testimonial carousel, Animated text, Cookie consent, Animated background, Modal box, Announcement bar, Image hotspots, Info circle, Slide box, Countdown, Content toggle, Off-canvas panel, Video gallery, Map and directions, Link effects, Tabcordion, Tooltip, Responsive table, Notice, Toast, Loading, Menu button, Radio group, Stepper, Tags, Scrollbox, Sticker. Or see all of them working.
More in Media & showcase
See them all working- Video gallery
All your videos on one page, sorted by topic, with your own thumbnails, and nothing loads from YouTube until someone picks one.
- Before / After
Show the old and the new in one frame, and let visitors drag to compare.
- Instagram feed
Your latest posts on your own site, from our copy of the images, so the grid does not go blank when Instagram changes its mind.
- Card slider
Show more reviews, team members or posts than fit across the page, and let visitors swipe or click through them.
Want the icon library on your site?
Tell us about the business. We build the site with it, launch it, and change it whenever you ask.