UnoCSS即时按需原子化 CSS 引擎

可定制 · 强大 · 快速 · 令人愉悦

完全可定制

没有核心工具类，所有功能都通过预设提供。

开始使用

即时响应

无需解析，无需 AST，无需扫描。比 Windi CSS 或 Tailwind CSS JIT 快 5 倍。

轻量级

零依赖且适合浏览器：压缩+Brotli 后约 6KB

丰富集成

对 Vite、Webpack、PostCSS、CLI、VS Code、ESLint 等提供一级支持。

了解更多

快捷方式

动态地为工具类设置别名或进行分组

配置与使用

属性化模式

在属性中对工具类进行分组

@unocss/preset-attributify

纯 CSS 图标

将任意图标作为一个单一类使用

@unocss/preset-icons

变体组

用于具有共同前缀的工具类分组的简写形式

@unocss/transformer-variant-group

CSS 指令

在 CSS 中通过 @apply 指令复用工具类

@unocss/transformer-directives

编译模式

在构建时将多个类合成为一个类

@unocss/transformer-compile-class

检查器

进行交互式的检查和调试

@unocss/inspector

CDN 运行时构建

通过一行 CDN 引入即可使用 UnoCSS

@unocss/runtime