Tokens and downloads
215 tokens generated from the source files. Download the outputs or consume the package.
- tokens.css · custom properties, theme blocks, text classes
- tokens.json · flat, resolved
- tamagui.tokens.js · data for createTokens, createFont and createTamagui
By type
| Type | Count |
|---|---|
| color | 116 |
| dimension | 58 |
| number | 12 |
| shadow | 3 |
| duration | 5 |
| cubicBezier | 4 |
| fontFamily | 2 |
| fontWeight | 4 |
| typography | 11 |
Consume in the app
import tokens from "@jinnga/design-system";
import { createFont, createTamagui, createTokens } from "@tamagui/core";
const sans = createFont(tokens.fonts.sans);
export const config = createTamagui({
tokens: createTokens({ color: tokens.color, space: tokens.space, size: tokens.size, radius: tokens.radius, zIndex: tokens.zIndex }),
themes: tokens.themes,
fonts: { body: sans, heading: sans },
media: tokens.media,
});Consume on the web
<link rel="stylesheet" href="https://design.warebit.com/tokens.css">
.button { background: var(--theme-primary); color: var(--theme-text-on-primary); min-height: var(--size-control-md); }