Export

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.

prefix

string

default:"--"

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

Getting Started

API Reference

Export Formats

Integrations

Export as CSS

Export as JSON

Export as TypeScript

​Export as CSS

​Export as JSON

​Export as TypeScript

Export as CSS

Export as JSON

Export as TypeScript