ALL-IN-ONE ICON ELEMENT

All-in-One Icon Element

Published May 2025

    •    Updated this week

Plugin details

 🧩 Plugin: All-in-One Icon Element

 🔗 Live Demo

[https://plugin-49094.bubbleapps.io/version-test/all-in-one\_icon\_element](https://plugin-49094.bubbleapps.io/version-test/all-in-one_icon_element)

 🛠 Editor Link

[https://bubble.io/page?id=plugin-49094\&test\_plugin=1748625840777x256481382001541120\_current\&tab=Design\&name=all-in-one\_icon\_element\&type=page\&elements=bTHzP](https://bubble.io/page?id=plugin-49094&test_plugin=1748625840777x256481382001541120_current&tab=Design&name=all-in-one_icon_element&type=page&elements=bTHzP)

---

 📝 Plugin Description

The **All-in-One Icon Element** is a universal icon renderer that supports 5 major icon libraries with full customization:

 ✅ Supported Icon Libraries:

* Font Awesome (Free)
* Material Icons (Google Fonts)
* Bootstrap Icons
* Feather Icons
* Ionicons (SVG fallback)

 🎨 Customizable Properties:

* Icon name
* Icon library
* Color
* Size
* Rotate (with animation)
* Responsive sizing

Free

For everyone

 stars   •   0 ratings

13 installs  

This plugin does not collect or track your personal data.

Other actions

Platform

Web

Contributor details

JiPalJi

Joined 2022   •   23 Plugins

View contributor profile

Instructions

 📦 How to Use

 1. Drag the element into your Bubble page.

 2. Set these properties:

* Icon Name**: e.g. `star`, `home`, `trash-outline`
* Icon Library**: choose from `"fontawesome"`, `"material"`, `"bootstrap"`, `"feather"`, `"ionicon"`
* Size: Any number (e.g. `24`, `48`)
* Color: e.g. `#FF6600`
* Rotate: Enable to animate the icon
* Responsive: Adjusts width to container

---

 🧪 Icon Reference Links

* Font Awesome → [fontawesome.com/icons](https://fontawesome.com/icons)
* Material Icons → [fonts.google.com/icons](https://fonts.google.com/icons)
* Bootstrap Icons → [icons.getbootstrap.com](https://icons.getbootstrap.com)
* Feather Icons → [feathericons.com](https://feathericons.com)
* Ionicons → [ionic.io/ionicons](https://ionic.io/ionicons)

Types

This plugin can be found under the following types:

Element

Resources

Support contact

Documentation

Tutorial

Rating and reviews

No reviews yet

This plugin has not received any reviews.

Product

Bubble for

Discover

How Bubble works

Examples

Pricing

Learn

Resources

Community

Company

Legal

Terms

Privacy

©  2026, Bubble Group, Inc. All rights reserved.

Pricing

Enterprise

Contact sales

All-in-One Icon Element

Plugin details

Free

For everyone

Other actions

Platform

Contributor details

Instructions

Types

Categories

Resources

Rating and reviews

No reviews yet