Token specimen
A live side-by-side display of resolved Brickwork design tokens.
Try it
Level-three token pack
Compare recommended L3 tokens.
Use it
Working invocation
This code creates the configuration shown above. Copy the template and the required Python context together.
{% load brickwork_theming %}
{% bw_token_specimen level=level heading=heading %}context = {'level': 'L3', 'heading': 'Brand foundation'}Guide
Add it to your project
- Load `brickwork_theming`.
- Call with no argument for load-bearing tokens, or with exactly one of tokens and level.
Options
Public API
| Option | Type | Default | Required | Description |
|---|---|---|---|---|
| tokens | sequence of token names | Not set | No | Overridable --bw-* tokens. Constraint: Each token must be a package token name; do not combine this selector with `level`. |
| heading | string | Not set | No | Section heading. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
| level | string | Not set | No | Recommended token level. Allowed: L1, L2, L3, L4. Constraint: Mutually exclusive with tokens. |
Behaviour
Accessibility and responsive behaviour
- Accessibility
- Each pane is a labelled group; visual swatches are hidden from assistive technology and contrast chips name the pair and floor.
- Responsive
- Theme panes stack below md.
- Without JavaScript
- Without JS token values and measured contrast remain empty, while names and declared floors remain.
Need help?
Troubleshooting
Contract check: (templatetags/brickwork_theming.py): never {% include %} directly; the tag
Use the token-specimen tag so it builds rows from the token manifest or validates an explicit token list.