unocss / unocss
The instant on-demand atomic CSS engine.
AI Architecture Analysis
This repository is indexed by RepoMind. By analyzing unocss/unocss in our AI interface, you can instantly generate complete architecture diagrams, visualize control flows, and perform automated security audits across the entire codebase.
Our Agentic Context Augmented Generation (Agentic CAG) engine loads full source files into context on-demand, avoiding the fragmentation of traditional RAG systems. Ask questions about the architecture, dependencies, or specific features to see it in action.
Embed this Badge
Showcase RepoMind's analysis directly in your repository's README.
Repository Summary (README)
Preview
UnoCSS
The instant on-demand Atomic CSS engine.
💡 I highly recommend reading this blog post -
Reimagine Atomic CSS
for the story behind
📚 Documentation | 🧑💻 Interactive Docs | 🤹♂️ Playground | 🎓 Tutorial
Features
Inspired by Windi CSS, Tailwind CSS, and Twind, but:
- Fully customizable - no core utilities. All functionalities are provided via presets.
- No parsing, no AST, no scanning, it's INSTANT (5x faster than Windi CSS or Tailwind JIT).
- ~6kb min+brotli - zero deps and browser friendly.
- Shortcuts - aliasing utilities, dynamically.
- Attributify mode - group utilities in attributes.
- Pure CSS Icons - use any icon as a single class.
- Variant Groups - shorthand for group utils with common prefixes.
- CSS Directives - reuse utils in CSS with
@applydirective. - Compilation mode - synthesizes multiple classes into one at build time.
- Inspector - inspect and debug interactively.
- CSS-in-JS Runtime build - use UnoCSS with one line of CDN import.
- VS Code extension
- Code-splitting for CSS - ships minimal CSS for MPA.
Documentation
Read the documentation for more details.
Installation
Acknowledgement
UnoCSS is made possible thanks to the inspirations from the following projects:
in alphabetical order
Sponsors
License
MIT License © 2021-PRESENT Anthony Fu