The export endpoints return your tokens transformed into platform-specific formats. All values are fully resolved — color scale references become hex values, primitive references become concrete numbers.
Export as CSS
Returns CSS custom properties with light and dark mode support.
CSS variable prefix. For example, --ds produces --ds-color-brand-primary.
naming
string
default:"kebab-case"
Variable naming convention: kebab-case, camelCase, or snake_case.
curl https://humic.dev/api/v1/export/css \
-H "Authorization: Bearer sk_live_your_key"
:root {
--color-brand-primary: #36AA08;
--color-brand-secondary: #1E5B0F;
--spacing-page-gutter: 16px;
--font-size-body: 16px;
--radius-card: 8px;
}
[data-theme="dark"] {
--color-brand-primary: #5DC731;
--color-brand-secondary: #BAF59B;
}
Response content type: text/css
Export as JSON
Returns tokens in the W3C Design Tokens Community Group format. Dark mode values are included via Humic’s com.humic extension.
curl https://humic.dev/api/v1/export/json \
-H "Authorization: Bearer sk_live_your_key"
{
"color": {
"brand": {
"primary": {
"$value": "#36AA08",
"$type": "color",
"$extensions": {
"com.humic": {
"dark": "#5DC731"
}
}
}
}
},
"spacing": {
"page": {
"gutter": {
"$value": "16px",
"$type": "dimension"
}
}
}
}
Export as TypeScript
Returns a typed constant and a union type for all token names. Useful for type-safe token access in your application.
curl https://humic.dev/api/v1/export/ts \
-H "Authorization: Bearer sk_live_your_key"
export const tokens = {
color: {
brand: {
primary: "#36AA08",
secondary: "#1E5B0F",
},
},
spacing: {
page: {
gutter: "16px",
},
},
} as const
export type TokenName =
| "color.brand.primary"
| "color.brand.secondary"
| "spacing.page.gutter"
Response content type: text/plain