UnoCSS

Instant On-demand Atomic CSS Engine

Customizable · Powerful · Fast · Joyful

Getting Started

Interactive Docs

Playground

Tutorial

Fully Customizable

No core utilities, all functionalities are provided via presets.

Getting Started

Instant

No parsing, no AST, no scanning. It's 5x faster than Windi CSS or Tailwind CSS JIT.

Lightweight

Zero deps and browser friendly: ~6kb min+brotli

Rich Integrations

First class support of Vite, Webpack, PostCSS, CLI, VS Code, ESLint, etc.

Learn more

Shortcuts

Aliasing or grouping utilities, dynamically

Configuration and usage

Attributify Mode

Group utilities in attributes

@unocss/preset-attributify

Pure CSS Icons

Use any icon as a single class

@unocss/preset-icons

Variant Groups

Shorthand for group utils with common prefixes

@unocss/transformer-variant-group

CSS Directives

Reuse utils in CSS with @apply directive

@unocss/transformer-directives

Compilation Mode

Synthesizes multiple classes into one at build time

@unocss/transformer-compile-class

Inspector

Inspect and debug interactively

@unocss/inspector

CDN Runtime Build

Use UnoCSS with one line of CDN import

@unocss/runtime