UnoCSS 的定位是具象化的原子化引擎：它不像 Tailwind 那样自带一套固定类名，而是让你按 preset 组合规则——想要 Tailwind 风格、attributify 属性化写法、图标支持、web 字体都可以装对应 preset，用不到的东西一行也不会进产物。它扫描源码按需生成 CSS，构建速度和产物体积都极为出色。
与 Tailwind 相比，UnoCSS 胜在可扩展性、编译速度和 preset 化的灵活性；生态规模、社区认知度与招聘 familiarity 则是 Tailwind 占优。它与 Vite 深度集成（通过 unplugin universial 机制），在 Vue/Nuxt 项目里几乎零配置即可用。如果你的项目对包体敏感、团队又喜欢原子类的开发体验，UnoCSS 是值得认真评估的选择。
<style> .bg-blue { background: #4a9eff; } .text-white { color: #fff; } .rounded { border-radius: 6px; } .px-4 { padding-left: 16px; padding-right: 16px; } .py-2 { padding-top: 8px; padding-bottom: 8px; } </style> <button class="bg-blue text-white rounded px-4 py-2"> UnoCSS 按需生成的原子类 </button>