Creating universal design systems across web and mobile with Utility First Styling
summary
Argues that the useful claim is that design tokens can be a single source of truth and actually sync from design to code: uses Figma Token Studio pushed to GitHub, transforms via Style Dictionary, updates a Tailwind config and rebuilds web and iOS, demo shows tokens propagate and styles match after a rebuild. Shows utility‑first tokens fit into component libraries, implements platform behaviors (hover on web, ripple on Android, haptics on iOS) and warns layouts are rarely shareable.
AI-written summary · about
chapters (4)
related talks
28mScalable CSS Architecture with Design Tokens
01h 00mDesign Token Architecture
35mThe Evolution of Design Tokens
25mDesign systems for agencies
35mDesign Tokens for Cross-platform Design Systems
49mExploring the Anatomy of Design Systems
13mLightning Talk: Design Tokens – Searching for a Source of Truth
38mStyleguide-Driven Development