Web
CSS variables with live component tree preview and cross-platform token mapping.
iOS
PrimerCheckoutTheme tokens with live preview and Swift code generation.
Android
PrimerTheme tokens with live preview and Kotlin code generation.
Design Tokens Explorer
Explore design tokens and see which components they affect in real-time.
Explore how design tokens affect different components in Primer Checkout. Select a token to see which components it impacts, adjust values with sliders and color pickers, and copy the generated code.
Choose your platform to launch the interactive explorer: