$ show master-co/css
Master CSS is a comprehensive CSS framework and toolchain that enables writing CSS directly in class attributes using a concise utility syntax. The system supports multiple rendering modes: a runtime engine that dynamically generates and injects CSS in the browser, a static build-time compilation mode for zero-runtime production output, and progressive hybrid modes that pre-generate critical CSS and hydrate on the client. It includes a fully modular architecture with over 30 packages covering a core engine, compiler, scanner for class extraction, validator, language server, ESLint plugin, CLI, MCP server, and first-class integration plugins for Vite, Next.js, Nuxt, Astro, Svelte, Webpack, and more. The codebase is production-grade with extensive unit and e2e tests, a dedicated benchmarking suite measuring CSS output sizes, build timings, and browser lifecycle performance, and a documentation site with interactive playground. While primarily a JavaScript/TypeScript application library, it also contains benchmark infrastructure that produces analytical metrics. The architecture is strongly layered with well-defined schema contracts (manifest JSON) enabling loose coupling between packages.
The LLM identified 5 files worth highlighting for reuse:
Entry point for the Master CSS compiler. Exports `compileCSSManifest` and `compileCSSFile` functions that take a CSS manifest (with variables, utilities, conditions) and produce compiled CSS output. Handles import resolution, directive processing, and manifest merging. This is a self-contained module that can be reused in any build tool or script to pre-generate static CSS from a manifest. Demonstrates clean separation of concerns and a well-defined contract via the manifest schema.
Core `MasterCSS` class that parses class names (e.g., `fg:blue-60`, `bg:surface-base`) and generates corresponding CSS rules with proper cascade layer ordering. Manages theme layers, utility layers, variable rules, animation rules, and condition rules. Uses efficient matcher indices for fast class resolution. This is the heart of the framework and is reused by both the runtime and the compiler. Its interface is minimal and well-documented, making it suitable for extraction into other CSS utility frameworks.
Provides `isClassValid` and `validateCSS` functions that check class names against a manifest for syntax correctness, approved values, and conflict detection. Includes a `generateValidRules` memoized cache for performance. This module is used by the ESLint plugin, language server, and CLI for real-time validation. Its dependency on the manifest schema makes it decoupled and reusable in any environment that needs CSS class validation.
`CSSLanguageService` class that provides IDE features: completion items (classes, values, colors, pseudo-classes), hover documentation, semantic tokens, syntax inspection, and directive formatting. Built on a completion index that precomputes results for fast lookup. This package is consumed by the language server and VSCode extension but could be adapted for other editors. It demonstrates a well-factored API for language intelligence.
`CSSScanner` class that extracts CSS class candidates from source files using a pipeline of adapters (HTML, JSX, Vue, Svelte, Astro, Oxc). Supports content-hash caching for incremental scans, file watching via chokidar, and safelist/blocklist filtering. Used by build tool plugins and CLI to discover class usage. Its adapter pattern and caching strategy make it reusable for any framework that needs to scan source files for specific patterns.