SVG Library›Free Icons and UI Symbols›Sparkles

What Sparkles is good for

Sparkles icon for featured and AI states.

Use this asset in code, Figma, docs, decks, or product surfaces. The item page supports local preview, up to three detected color replacements, and export as SVG or PNG.

Use it in your workflow

  • Copy the raw SVG when you want the original markup.
  • Copy JSX when the asset is going straight into a React or Next.js component.
  • Copy a React component when you want a reusable wrapper with props support.
  • Download PNG when the destination needs a raster graphic for slides, docs, or CMS fields.

Browse related collections and guides

Collections

Free Icons and UI Symbols

Guides

Use SVG in FigmaUse SVG in ReactDownload PNG from SVGCustomize SVG ColorsUse SVG for Docs and PresentationsPNG to SVG Alternatives

FAQ

What is Sparkles useful for?

Sparkles is useful for interface layouts, product UI, editorial graphics, docs, and presentation work where you need a reusable vector asset.

Can I customize Sparkles before exporting it?

Yes. The asset page supports local preview, up to three detected color replacements, and export as SVG or PNG.

Can I use Sparkles in code instead of downloading a file?

Yes. The item page can provide raw SVG, JSX, and a React component version for direct use in codebases.

Related assets

Badge Plus

Add-state badge in Lucide style.

Grid 2x2

Simple grid glyph for app navigation.

Layout Grid

Grid layout icon for dashboards and workspaces.

Panels Top Left

Layout and app-shell icon in Lucide style.

Wand Sparkles

Enhanced generate icon in Lucide style.

Sparkles

Sparkles icon from Heroicons.