Groups

Groups help organize related tokens within a token set. They create a hierarchical structure that makes your design system easier to navigate and understand.

Basic Syntax

Groups are defined by simply using a name followed by curly braces. The groupkeyword is optional:

Nested Groups

Groups can be nested to create deeper hierarchies:

Referencing Nested Tokens

Access tokens in nested groups using dot notation:

Group Organization Patterns

By Category

By Domain

By Component

Best Practices

•
Keep groups focused:Each group should contain related tokens
•
Use consistent naming:Follow a consistent naming pattern across groups
•
Avoid deep nesting:Keep hierarchies shallow (2-3 levels max)
•
Group by purpose:Organize tokens by their use case, not just type

Token Sets
Tokens