Roadmap
What’s shipped, what’s being worked on, and what’s queued. This is a statement of direction, not a delivery schedule.
How to read this
There are no dates here, deliberately. cia is built by a small team, and a date on a public roadmap becomes a promise that distorts the work — you ship to the date instead of to the standard. Items move between sections as things land or get reprioritised, and anything in Considering may never ship at all. That last part is meant literally.
The detailed work items live in roadmap/epics/ — user stories, acceptance criteria and the reasoning behind each call. If you want to know why something is shaped the way it is, that’s where it’s written down.
Shipped
Available today, gated in CI on every push.
- Published on npm.
npm install css-is-awesomeworks, and jsDelivr and unpkg mirror every release for build-free consumption. Install. - 24 themes, eight families × three variants. Each builds from exactly one SCSS source, and dropping one in as
theme.cssrestyles a page with no markup change. - Themeable spacing. Themes own the numbered scale, so swapping a theme changes a page’s proportions and not just its palette.
- Accessibility enforced by default. Every theme is audited for WCAG 2.2 AA contrast across 22 token pairs, and a failing theme fails the build. How that works.
- Zero JavaScript in the package. Installing cia downloads CSS and SCSS. Nothing else.
- An MCP server so AI agents can query the real API instead of guessing at it. Tool reference.
- A recipes book — five framework-agnostic patterns: dialog, combobox, print-to-PDF, mobile-nav and bottom-nav. Browse them.
- A zero-JS mobile toolkit — hamburger, drawer, sheet and dock mixins on the native Popover API, plus the playbook that ties them together. Mobile.
- A recipe registry and a health check in the CLI —
npx cia add <recipe>copies a pattern from the book into your project so you own it, andnpx cia analyzeaudits your stylesheets against the installed API (dead symbols, the spacing-scale trap, hard-coded colors, BEM creep) with CI-ready exit codes. - A dated browser-support matrix — the Baseline floor the native primitives set, and every progressive enhancement with its exact fallback. Browser support.
- A theme editor on this site, with a download that drops straight into a project.
- Migration tooling —
npx cia migrate tailwindconverts an existing config into a cia theme.
Working on now
- The Figma pipeline, phase one — the token bridge: export the theme contract as Figma variables (each cia theme a variable mode) and import a designer's variables back through the validator.
- The dropdown recipe — recipe #6, from the reference implementation the docs already run.
Next up
- The blog grows a second track — alongside the engineering post-mortems, a CSS discoveries track: new and cool platform CSS as we find it, with cia as the sponsor rather than the subject. Blog.
- The MCP server as its own installable package so it takes one line of config and no install step. Today it needs dependencies added by hand, which nobody should have to discover.
- The rest of the Figma pipeline — beyond the token bridge above: a published cia Figma Library whose component names mirror the mixins, and a machine-readable mapping served over MCP so AI agents translate Figma frames into cia calls directly.
- More recipes — datepicker, data table, command palette, multiselect combobox, breadcrumb, pagination, file upload, toast, sortable list, colour picker.
- A guided installer.
npm create cia— asks which framework and theme, then wires the SCSS entry point for you. - The density knob. One variable that rescales the entire spacing system, so a theme can feel compact or airy from a single line.
- Stricter accessibility recipes as an optional add-on — WCAG-strict variants with live-region announcements and full focus management.
- Proving the codegen pipeline — generating React components from recipes, to see whether the approach holds up before committing to it.
Further out
- RTL audit — sweep the source for physical properties that should be logical, with tests in a real RTL locale.
- Form validation and i18n recipes — native validation, popular form libraries, date and currency formatting, pluralisation.
- More migration paths — reading MUI and Chakra theme objects, and a DTCG bridge for design-token pipelines.
- A Figma plugin for two-way sync between Figma variables and cia tokens.
- A community theme gallery, with submissions by pull request.
- Editor tooling — autocomplete and hover docs for the mixin API.
Considering — may not ship
Ideas we like that haven’t earned their place yet. Listed so the thinking is visible, not because they’re committed.
- A visual recipe builder — compose a component in the browser and export the SCSS. Genuinely useful if it works, and a large amount of surface area to maintain if it half-works.
- Angular component generation, if the React codegen experiment proves out.
Want to change what’s on this list?
Real usage moves things up faster than anything else. If something here is blocking you, or something missing would have saved you an afternoon, say so — that’s the signal this list is prioritised against.
The principles that decide what gets built are in Three tiers and Accessibility. The short version: mixins over classes, the consumer names their own selectors, and accessibility is a build gate rather than a guideline.