IconSearch logoIconsearch
Last updated: September 2026

Fluent UI System Color Icons

Fluent UI System Color Icons is an open-source vector icon collection containing 890 icons under the MIT license. Every SVG icon in Fluent UI System Color Icons is optimized for web, mobile, and desktop applications, providing clean scalable vector graphics with crisp rendering across high-DPI displays. The collection is licensed under MIT; review the icon license guide for commercial-use details.

GitHub ↗npm ↗Docs ↗
🔍
FLUENT UI SYSTEM COLOR ICONS CATALOG (Showing 120 of 890)
AddCircle16 SVG icon
AddCircle16
AddCircle20 SVG icon
AddCircle20
AddCircle24 SVG icon
AddCircle24
AddCircle28 SVG icon
AddCircle28
AddCircle32 SVG icon
AddCircle32
AddStarburst16 SVG icon
AddStarburst16
AddStarburst20 SVG icon
AddStarburst20
AddStarburst24 SVG icon
AddStarburst24
AddStarburst28 SVG icon
AddStarburst28
AddStarburst32 SVG icon
AddStarburst32
AddStarburst48 SVG icon
AddStarburst48
Agents16 SVG icon
Agents16
Agents20 SVG icon
Agents20
Agents24 SVG icon
Agents24
Agents28 SVG icon
Agents28
Agents32 SVG icon
Agents32
Agents48 SVG icon
Agents48
Alert16 SVG icon
Alert16
Alert20 SVG icon
Alert20
Alert24 SVG icon
Alert24
Alert28 SVG icon
Alert28
Alert32 SVG icon
Alert32
Alert48 SVG icon
Alert48
AlertBadge16 SVG icon
AlertBadge16
AlertBadge20 SVG icon
AlertBadge20
AlertBadge24 SVG icon
AlertBadge24
AlertBadge32 SVG icon
AlertBadge32
AlertUrgent16 SVG icon
AlertUrgent16
AlertUrgent20 SVG icon
AlertUrgent20
AlertUrgent24 SVG icon
AlertUrgent24
AnimalPawPrint16 SVG icon
AnimalPawPrint16
AnimalPawPrint20 SVG icon
AnimalPawPrint20
AnimalPawPrint24 SVG icon
AnimalPawPrint24
AnimalPawPrint28 SVG icon
AnimalPawPrint28
AnimalPawPrint32 SVG icon
AnimalPawPrint32
AnimalPawPrint48 SVG icon
AnimalPawPrint48
ApprovalsApp16 SVG icon
ApprovalsApp16
ApprovalsApp20 SVG icon
ApprovalsApp20
ApprovalsApp24 SVG icon
ApprovalsApp24
ApprovalsApp28 SVG icon
ApprovalsApp28
ApprovalsApp32 SVG icon
ApprovalsApp32
Apps16 SVG icon
Apps16
Apps20 SVG icon
Apps20
Apps24 SVG icon
Apps24
Apps28 SVG icon
Apps28
Apps32 SVG icon
Apps32
Apps48 SVG icon
Apps48
AppsList20 SVG icon
AppsList20
AppsList24 SVG icon
AppsList24
AppsList32 SVG icon
AppsList32
AppsListDetail20 SVG icon
AppsListDetail20
AppsListDetail24 SVG icon
AppsListDetail24
AppsListDetail32 SVG icon
AppsListDetail32
ArrowClockwiseDashes16 SVG icon
ArrowClockwiseDashes16
ArrowClockwiseDashes20 SVG icon
ArrowClockwiseDashes20
ArrowClockwiseDashes24 SVG icon
ArrowClockwiseDashes24
ArrowClockwiseDashes32 SVG icon
ArrowClockwiseDashes32
ArrowClockwiseDashesSettings16 SVG icon
ArrowClockwiseDashesSettings16
ArrowClockwiseDashesSettings20 SVG icon
ArrowClockwiseDashesSettings20
ArrowClockwiseDashesSettings24 SVG icon
ArrowClockwiseDashesSettings24
ArrowClockwiseDashesSettings28 SVG icon
ArrowClockwiseDashesSettings28
ArrowClockwiseDashesSettings32 SVG icon
ArrowClockwiseDashesSettings32
ArrowClockwiseDashesSettings48 SVG icon
ArrowClockwiseDashesSettings48
ArrowSquare20 SVG icon
ArrowSquare20
ArrowSquare24 SVG icon
ArrowSquare24
ArrowSquare32 SVG icon
ArrowSquare32
ArrowSquareDown20 SVG icon
ArrowSquareDown20
ArrowSquareDown24 SVG icon
ArrowSquareDown24
ArrowSquareDown32 SVG icon
ArrowSquareDown32
ArrowSync16 SVG icon
ArrowSync16
ArrowSync20 SVG icon
ArrowSync20
ArrowSync24 SVG icon
ArrowSync24
ArrowTrendingLines20 SVG icon
ArrowTrendingLines20
ArrowTrendingLines24 SVG icon
ArrowTrendingLines24
Beach16 SVG icon
Beach16
Beach20 SVG icon
Beach20
Beach24 SVG icon
Beach24
Beach28 SVG icon
Beach28
Beach32 SVG icon
Beach32
Beach48 SVG icon
Beach48
Board16 SVG icon
Board16
Board20 SVG icon
Board20
Board24 SVG icon
Board24
Board28 SVG icon
Board28
Book16 SVG icon
Book16
Book20 SVG icon
Book20
Book24 SVG icon
Book24
Book28 SVG icon
Book28
Book32 SVG icon
Book32
Book48 SVG icon
Book48
BookContacts16 SVG icon
BookContacts16
BookContacts20 SVG icon
BookContacts20
BookContacts24 SVG icon
BookContacts24
BookContacts28 SVG icon
BookContacts28
BookContacts32 SVG icon
BookContacts32
BookContacts48 SVG icon
BookContacts48
BookDatabase16 SVG icon
BookDatabase16
BookDatabase20 SVG icon
BookDatabase20
BookDatabase24 SVG icon
BookDatabase24
BookDatabase32 SVG icon
BookDatabase32
BookOpen16 SVG icon
BookOpen16
BookOpen20 SVG icon
BookOpen20
BookOpen24 SVG icon
BookOpen24
BookOpen28 SVG icon
BookOpen28
BookOpen32 SVG icon
BookOpen32
BookOpen48 SVG icon
BookOpen48
BookOpenLightbulb20 SVG icon
BookOpenLightbulb20
BookOpenLightbulb24 SVG icon
BookOpenLightbulb24
BookOpenLightbulb32 SVG icon
BookOpenLightbulb32
BookStar20 SVG icon
BookStar20
BookStar24 SVG icon
BookStar24
Bookmark16 SVG icon
Bookmark16
Bookmark20 SVG icon
Bookmark20
Bookmark24 SVG icon
Bookmark24
Bookmark28 SVG icon
Bookmark28
Bookmark32 SVG icon
Bookmark32
Bot16 SVG icon
Bot16
Bot20 SVG icon
Bot20
Bot24 SVG icon
Bot24
BotSparkle16 SVG icon
BotSparkle16

Fluent UI System Color Icons Specifications & Framework Compatibility

Fluent UI System Color Icons Specifications, Licensing, and Framework Compatibility
PropertySpecification Details
Total Icons890 vector SVG icons
LicenseMIT (Commercial & Personal Use)
TypeScript SupportNative .d.ts definitions included
Framework SupportReact, Next.js, Vue, Svelte, Tailwind CSS
Primary NPM Package@iconify-json/fluent-color
Source RepositoryOfficial GitHub Repository →

How many icons does Fluent UI System Color Icons have?

Fluent UI System Color Icons currently includes 890 vector icons indexed in the IconSearch catalog. Every icon is available in clean SVG format with customizable stroke widths, colors, and direct multi-framework code exports for modern web applications.

Is Fluent UI System Color Icons free for commercial use?

Yes, Fluent UI System Color Icons is distributed under the MIT license. This permissive open-source license allows unrestricted commercial and personal usage in proprietary software, SaaS platforms, client websites, and digital products without licensing fees.

How do you install and use Fluent UI System Color Icons in React, Next.js, and Vue?

Install the package using npm install @iconify-json/fluent-color, then import icons directly into your JSX, TSX, or Vue components. Alternatively, copy raw customized SVG markup directly from IconSearch with zero client-side JavaScript overhead.

// Install package
npm install @iconify-json/fluent-color

// React & Next.js App Router usage
import { AddCircle16 } from '@iconify-json/fluent-color'

export default function Header() {
  return <AddCircle16 className="w-5 h-5 text-indigo-500" />
}
FREQUENTLY ASKED QUESTIONS

Fluent UI System Color Icons FAQ & Technical Guide

How many icons does Fluent UI System Color Icons have?

Fluent UI System Color Icons contains 890 open-source vector icons available in SVG format on IconSearch.

Is Fluent UI System Color Icons free for commercial use?

Yes, Fluent UI System Color Icons is licensed under the MIT license, which permits commercial and personal use in software applications, websites, and design projects without subscription fees.

How do you install and use Fluent UI System Color Icons in React, Next.js, and Vue?

You can install the official package via `npm install @iconify-json/fluent-color` or copy customized React JSX, Vue 3, Svelte, or SVG code directly from IconSearch with zero runtime overhead.

Does Fluent UI System Color Icons support TypeScript?

Yes, icon definitions and SVG React/Vue component wrappers for Fluent UI System Color Icons include TypeScript type definitions for autocomplete and prop validation.

Can I customize stroke width, size, and color for Fluent UI System Color Icons icons?

Yes, IconSearch provides an interactive customizer to modify size, hex color, stroke width, and CSS currentColor before copying code or downloading SVGs.

Disclaimer: IconSearch is an independent open-source discovery platform and is not affiliated with, sponsored by, or endorsed by the Fluent UI System Color Icons maintainers or any featured open-source projects. All trademarks, logos, and brand names are the property of their respective owners.