The W3C design tokens spec just went stable, and hex codes broke
By The WAALEE Team · · 5 min read
On October 28, 2025, the W3C Design Tokens Community Group shipped 2025.10, the first stable version of the Design Tokens Format Module. Twenty-plus companies signed off on it, including Adobe, Figma, Google, Salesforce, and Shopify. That's the headline. The part that actually touches your codebase is smaller and easy to miss: the way you write a color value changed.
The part that breaks: color is no longer just a string
Before 2025.10, a token file writer could get away with a hex string and call it done: `{ "$value": "#4f9bf5" }`. The stable color module requires `$value` to be an object with a `colorSpace` and its component channels, with hex allowed only as an optional fallback alongside it. That's not cosmetic. It's how the spec adds real support for Display P3 and Oklch, the wide-gamut spaces most design tools already use internally but couldn't express portably before now.
This isn't hypothetical friction. Penpot's own tracker has an open issue for exactly this: a color token that only stores a hex string no longer parses as valid DTCG 2025.10, because the new spec expects the structured object form. If you maintain a tool that reads or writes token files, or you hand-authored a tokens.json file for your AI builder, this is the line that will trip you.
Why this matters more now than it would have a year ago
Design tokens used to be a designer-to-developer handoff problem. Now they're a designer-to-AI handoff problem too. Claude, Lovable, v0, Cursor, and Bolt all do a better job when you feed them a real token file instead of a paragraph describing your brand. A token file that's quietly non-compliant with the current spec is one that a stricter parser, or a future version of your builder's importer, will start rejecting.
- Theming and multi-brand support, so light/dark and brand variants don't need duplicate files.
- Token relationships: aliases and component-level references instead of copy-pasted values.
- Wide-gamut color (Display P3, Oklch, the full CSS Color Module 4 space), which is the piece that forced the value format to change.
What doesn't change
Your CSS is fine. `#4f9bf5` still works everywhere it always did, in a stylesheet, a Tailwind config, a Figma fill. This is specifically about the interchange file, the JSON that's supposed to be the portable, tool-agnostic source of truth. If nothing reads or writes that file directly, 2025.10 changes nothing about your day. It matters the moment you, or your AI builder, or a design tool, tries to round-trip a token file through a spec-compliant parser.
What to actually do about it
You don't need to hand-edit a token file to fix this. The practical move is to stop hand-authoring tokens at all and instead extract them, either from your own live site or from a reference you're rebuilding, straight into current DTCG format. That sidesteps the whole hex-vs-object question because the export does it correctly by construction. If you already have an older token file lying around, treat it the same way you'd treat a deprecated API: regenerate it rather than patch the color values by hand.
This is also a decent moment to sanity-check whatever your AI builder is actually consuming. A prose brief ("our primary is a mid blue") never breaks, because there's nothing to validate. A token file can, silently, and the failure mode is usually a build that half-works: some colors resolve, the ones expressed as bare hex don't, and you spend an afternoon debugging a theme instead of a spec compliance issue.
Who's actually exporting to 2025.10 right now
A handful of extractors already export W3C-format tokens from a live URL. Here's how they compare on the color-format question specifically:
- designlang: Open-source CLI plus MCP server for Claude Code, Cursor, and Windsurf. Emits DTCG tokens (primitive, semantic, composite) plus Tailwind, Figma variables, and native iOS/Android/Flutter output.
- Design Extractor: Crawls a URL into a DESIGN.md built for AI coding agents, with a dedicated W3C Design Tokens (DTCG) export alongside Tailwind v4 and CSS variables.
- WAALEE: Reads the rendered DOM of any URL and exports W3C-compliant tokens plus AI-ready prompts for Claude, Lovable, v0, Cursor, and Bolt, with a WCAG contrast pass built in. No install.
The honest read: the spec going stable is good news, it means the format finally has a floor everyone can build against. But "W3C tokens" as a label is about to mean something more specific than it used to. Before you drop a token file into your next AI build, it's worth checking that whatever produced it actually speaks 2025.10, not the looser draft everyone was improvising against for the last two years.