FCSS is a utility-first CSS system that names classes exactly like CSS properties and values, so a class like "padding 24" produces "padding: 24px". It enforces a one-class-one-declaration model with no runtime: the library ships a full stylesheet (~28 MB) containing every class, and a build-time purge removes unused rules so the browser gets plain CSS. Class names can include pseudo selectors, ARIA states and responsive prefixes (e.g., "color red:hover", "display block:aria-expanded:true", "md-display none"), breakpoints are mobile-first, and colors are exposed via custom properties for easy theming. The scanner finds classes in HTML, JS/TS, JSX/TSX, Angular templates and .astro files; Vue and Svelte files are not scanned yet.
The project is packaged as @functionalcss/core plus integrations for Vite, Next.js, Astro, Angular, PostCSS and a CLI for plain HTML/CDN use. Typical installs import @functionalcss/core/full.css in development and use the framework plugin or CLI to purge in production. Configuration is optional via fcss.config.ts, and CLI tools (npx fcss list/explain) help inspect classes. Important usage rules: write class names statically (runtime-assembled names get purged) or add them to a safelist, and note Next.js with Turbopack may require forcing webpack for build-time purging. System requirements include Node.js 20.19+ or Bun.
Summary generated by AI from the linked article. hn.today is not affiliated with Hacker News or Y Combinator.