W3C DTCG Specification
Design Token Types
The W3C DTCG specification defines 15 token types — 10 primitive and 5 composite. Each page covers the format, valid values, and examples you can validate right now.
Primitive Types
color
Color
Represents a single color value in your design system.
dimension
Dimension
Represents a distance or size measurement.
fontFamily
Font Family
Represents a font family name or a list of fallbacks.
fontWeight
Font Weight
Represents the weight (boldness) of a typeface.
fontStyle
Font Style
Represents the style (normal or italic) of a typeface.
number
Number
Represents a unitless numeric value.
duration
Duration
Represents a length of time for animations or transitions.
cubicBezier
Cubic Bezier
Represents an easing curve for animations.
string
String
Represents an arbitrary text value.
strokeStyle
Stroke Style
Represents the visual style of a stroke or border line.
Composite Types
border
Border
Represents a complete border: color, width, and style.
shadow
Shadow
Represents a drop shadow or box shadow effect.
gradient
Gradient
Represents a gradient with color stops.
typography
Typography
Represents a complete typographic style.
transition
Transition
Represents a complete CSS transition definition.
Ready to validate your tokens?
Open Validator