A newly leaked internal doc reveals Google is overhauling its Material 3 token system. The big news: tokens are about to become the “new design API” for theming, touching everything from colors to spacing to motion. In Google’s own words, design tokens are “small, reusable design decisions” that form a design system’s visual style. The leak suggests Google will expand these tokens far beyond color, and give developers powerful new tools to manage them. In short, if you build scalable themes or UI systems, get ready – theming as you know it is evolving.
Tokens Take Center Stage
According to the leak, Google wants to treat tokens as first-class code. In practice, that means anything that used to be a static style value becomes a named token that you reference in code. The doc reportedly calls tokens the “new design API” and emphasizes unifying styling across all platforms. Google’s official Material docs already define tokens as “small, reusable design decisions”, and now those tokens are going to drive much more of the UI. The leaked roadmap shows Material Theme Builder (the Figma plugin) and code libraries now generate token-based artifacts. For example, the Compose Material Theme Builder can already export a Color.kt file containing all your color roles for light/dark themes. The new system will extend that idea: you’ll be able to export tokens not just for Android/Kotlin but for Flutter, React, web, etc., so your theme is truly cross-platform.
Beyond Color: Shape, Spacing, Motion, Typography, Elevation
Right now Material 3 themes have tokens for colors, typography, and some shapes. The leak shows Google is adding shape and motion tokens system-wide. In fact, the Material roadmap (on Material Web) confirms “we are adding shape and motion system tokens to support building expressive Material experiences”. Spacing is next, too – the roadmap calls out a “density and spacing tokens” workstream to cover margins and density variants. In practice you’ll soon see named tokens for everything from button corner radii to how much padding to apply in a tight layout. Typography tokens are already there under “typography theming”, and elevation tokens (shadow depths) have been in Material Web (“Elevation ✅” in their roadmap). The idea is to give you tokens for every fundamental style: color, type, shape, spacing, motion, and even elevation or “surface” levels. This token expansion means you can tweak a theme’s animation easings or spacing ratios globally, just as easily as changing a color swatch.
Developer Tools and Platform Support
With tokens as the core theme API, Google is beefing up developer tools. The leak highlights several new dev-facing features:
- Token Versioning: You’ll be able to version your token sets like code. This means you can update a theme incrementally and lock in previous token values for older UI, reducing the friction of big theme changes.
- Context-Aware Overrides: Tokens can be tagged with contexts (dark mode, high-contrast mode, or even brand contexts). A token’s value under a “dark” tag will override the default in dark themes, for example. This lets you switch entire palettes or spacing scales with simple context keys.
- Platform Export Tools: Google plans built-in export support for multiple platforms. The existing Material Theme Builder plugin will get options to output Flutter and React (Material UI) code in addition to Android Compose. Already today the Theme Builder can generate Android theme files (e.g. a Theme.kt with light/dark ColorScheme setup). Expect similar one-click outputs for Flutter’s ThemeData, CSS variables, or JSON tokens for web frameworks.
The Material Theme Builder Figma plugin (shown above) already generates theme tokens (like “Primary”, “Secondary”, etc.) for Android apps. The leaked doc indicates future versions of this tool (and companion CLI tools) will produce tokens for Flutter, React, and other platforms too. Google even hints at new “SDK export” pipelines so that your custom token sets flow straight into Flutter and web builds. In short, whether you’re coding Compose or React, tokens will soon be a built-in part of your UI toolkit.
The leak shows token-driven theming in action: the Theme Builder’s settings panel can generate Android Styles and State Layers (see right side) for your tokens. Google is making it easier to turn tokens into actual assets. For example, “Generate Android Styles” will create Android XML styles from your color tokens, and “Generate State Layers” will create color overlays for different UI states. The goal is a smooth handoff: design tokens defined in Figma automatically become styles or constants in every target environment.
Why This Matters for You
If you maintain a design system or multi-platform app, this shift is huge. Right now, theming often means juggling separate APIs or manual overrides on each platform. With tokens as a unified API, you’ll standardize theme logic. Instead of hard-coding “if dark mode then this color” all over, you’ll just point to a context-tagged token and let the system handle it. Your brand designers can update a token (say “brand accent color v2”) and that flows everywhere without hunting down every widget. It also means easier testing: tokens can be versioned and rolled back, so you can try a bold new spacing scale in one branch without breaking the main app.
From a technical standpoint, Google’s approach tackles fragmentation. Developers have long complained that Material implementations diverged: Compose, Android Views, Flutter, and the web library had different theming quirks. By elevating tokens to the design API, Google promises to align them. The leaked doc says tokens will even support brand flexibility – for example, companies could plug in a whole token palette under a “Partner” context. This solves pain points like forcing a brand color into a limited set of component props. In short, it turns theming into a data-driven model where “you simply consume tokens, and they do the heavy lifting” (paraphrasing the internal text).
Google’s Rationale and Timeline
Why now? The internal rationale: developers and designers are tired of hacks. The doc reportedly calls out messy overrides and inconsistencies as motivators. Material You’s dynamic color was just the beginning; Google wants theme definitions to be as flexible and fluid as its users. Tokens as an API also future-proofs theming – new properties (like a “padding token” or “gesture speed token”) can roll out without breaking existing UI.
As for timing, the leak hints this is already in play internally. Google has started dogfooding token changes in its own apps. For example, new token styles have been spotted in some Workspace apps and Android System UI flags. Screenshots and comments suggest Google may officially announce this at I/O (likely as part of Android 15/16 and Material Design 3 Expressive updates). In fact, the same leak that revealed “Expressive” design also noted subtle previews in Google’s Theme Builder and Android beta builds. All signs point to an I/O reveal, with early developer previews to follow. Until then, treat this as a heads-up: prepare your codebase for a token-centric era.