93
Icon Sets
A wide mix of UI icons, brands, pictograms, flags, and emoji-ready families in one package.
Vue 3 + Quasar 2
Quasar Extras SVG Icons
quasar-extras-svg-icons a collection of SVG packages that make it easy to integrate a wide arrange of SVG icons into Quasar applications.
Ship icon-heavy Quasar apps with flattened SVG sets, predictable import paths, and a built-in icon finder instead of hand-curating every upstream package yourself.
93 Icon SetsIcon FinderTyped ExportsVersioned FoldersQIcon ReadySVG Only
Icon LibraryImport-ready catalog
Search, compare, and import from a large icon catalog without leaving the Quasar workflow
Browse included families in the Icon Finder, keep readable import paths in app code, and rely on generated TypeScript exports when you want discovery and autocomplete to stay pleasant.
123,818
SVG Exports
Thousands of generated exports across the catalog, ready to import directly into Quasar apps.
96
Prefix Groups
Readable import prefixes help keep different icon families understandable in large codebases.
Start Here
Choose the next step that matches your workflow
Whether you are deciding if the package fits, searching for an icon family, or planning a production upgrade, the docs are organized to get you there quickly.
rocket_launch
Guide
Introduction
Understand how the package complements @quasar/extras and why the icon sets are flattened for Quasar.
travel_explore
Tool
Icon Finder
Browse the bundled icon families and copy the import names you need without hunting through upstream repos.
upgrade
Migration
Upgrade Guide
Review the v3 changes, versioned folders, and import-path policy before moving existing code forward.
campaign
Status
Releases
Track package changes, icon-family additions, and updates available in the current release line.
Included
What the package solves for Quasar applications
The goal is not just “more icons.” It is a better path from upstream SVG projects to icons that are practical to browse, import, and keep stable in real Quasar codebases.
integration_instructions
Quasar-Ready Strings
Use the exported values directly with QIcon, QBtn, and icon-set overrides instead of wrapping custom SVG components.
manage_search
Finder-Driven Discovery
The built-in Icon Finder gives the docs a practical way to search across the catalog before you write imports by hand.
data_object
Typed Imports
Generated TypeScript declarations make icon names easier to discover in editors and safer to refactor over time.
layers
Versioned Folders
When an icon family spans multiple supported majors, versioned folders make that explicit instead of hiding the upgrade cost.
cleaning_services
Curated Sources
Upstream icon packages are flattened and cleaned so the useful SVG output is easier to consume in applications.
category
Broad Family Coverage
Move between product UI icons, flags, brands, pictograms, and emoji-style assets without switching packages or workflows.
Featured
A few icon families you can reach for right away
The package spans product icons, brands, pictograms, emojis, flags, and more. Here are a few families that give a quick feel for the range.
Tabler Icons
A large outline and brand family that fits comfortably into modern application UIs.
Simple Icons
Brand marks for services, tools, frameworks, and platforms when product integrations need visual identity.
Carbon Icons
IBM Carbon icons and pictograms for product-style interfaces with a stronger enterprise visual language.
Fluent UI
Microsoft Fluent-style system icons for clean, contemporary application surfaces.
OpenMoji
Color emoji SVGs flattened for workflows that need expressive icons without leaving the package.
Country Flags
SVG flags for locale selectors, dashboards, and global products that need clear regional affordances.
...and many more. Explore all 93 icon sets in the Icon Finder, or check out the Icon Explorer App.
Ecosystem
Built for Quasar apps and documented with the md-plugins stack
The package gives you Quasar-friendly icon exports, while the docs run on Q-Press and the shared md-plugins tooling used across the sibling documentation sites.
Need Help?
Use the introduction for setup, then lean on finder, guides, and release notes
Most questions are answered by choosing the right doc entry point first: installation and import patterns, browsing icon families, migration notes, or troubleshooting edge cases.
Introduction + Imports
Start there when you need install commands, import patterns, and the relationship to @quasar/extras.
Icon Finder First
Use the finder whenever you are choosing between icon families or need the exact export names for a feature.
Upgrade + Release Notes
Check those before publishing when versioned folders or newer upstream icon packages are part of the change.
FAQ and Troubleshooting
The guides section covers best practices, common setup issues, and edge cases that show up in app integration.