Nuxt Compose Icons

Nuxt Compose Icons

Compose your own Icon components library

No extra wrapper needed.
Generated at build time, customizable at runtime using CSS custom properties

Size: 3

Main color

Get Started GitHub

SVG file to Vue component at build time

One component per SVG file, auto-imported and type-safe.
No manual registration in a Nuxt project.
Can be versioned independently.

Scales with your design system

Your own in-house icon component library, directly usable
Configurable naming conventions
Use CSS Custom Properties for theming, with global or scoped CSS.

Icons components can exist independently of Nuxt

Built folder from Nuxt can be shipped as independent Vue components.
Monorepo-friendly setup
A UI Library can consume these components or use them in Storybook.

Developer Experience

Auto-completion, type-checking for your icon components as any other Vue component.
Full Vue DevTools support, Icon component can be inspected individually