Docs/Design tokens

GET/v1/extract10 credits

Design tokens

The full design-token system: colors (with the CSS properties each is used on), font families, font sizes, font weights, letter spacing, line heights, the spacing scale, border radii and widths, box and text shadows, opacity steps, gradients, animation durations, easing curves, responsive breakpoints and z-indexes - each with a usage count, most-used first. Add &fields= to return only the groups you need, or &format=css / &format=tailwind for a ready-to-paste :root {} block or tailwind.config instead of JSON.

  • Generate a paste-ready tailwind.config or :root {} from a real site (add &format=).
  • Pull just the spacing + radius scale for a design-system audit (&fields=spacing,borderRadiuses).
  • Bootstrap a theme file - colors, type, spacing and motion - from a reference brand.
Parameters
urlrequiredThe page to extract from. With or without protocol (https:// is assumed).
formatoptionalOutput shape. css returns CSS custom properties (Content-Type: text/css); tailwind returns a theme config block (text/plain). Both are plain text, not JSON - fields is ignored and the usage object is omitted (credits are still metered, see the X-Quota-* headers). json (default) · css · tailwind
fieldsoptionalComma-separated list of token groups to return, JSON only (e.g. fields=colors,spacing). Omit for the full set. url and summary are always included. Trims the response only - the credit cost is unchanged. see the fields table below
fields values
colorsEvery color used, each { color, count }, most-used first.
fontSizesFont sizes, each { size, count }.
fontFamiliesFont families, each { family, count }.
fontWeightsFont weights, each { value, count }.
letterSpacingsLetter-spacing values, each { value, count }.
lineHeightsLine-height values, each { value, count }.
spacingSpacing scale from margin / padding / gap / inset, each { value, count }.
borderRadiusesBorder radii, each { value, count }.
boxShadowsBox shadows, each { value, count }.
gradientsGradients, each { value, type, count }. type ∈ linear, radial, conic.
durationsAnimation / transition durations, each { value, count }.
easingsEasing curves (cubic-bezier / steps / keywords), each { value, count }.
textShadowsText shadows, each { value, count }.
borderWidthsBorder / outline widths, each { value, count }.
opacitiesOpacity values below 1, each { value, count }.
breakpointsResponsive breakpoints from @media min/max-width queries, ascending, each { value, count }.
zIndexesz-index values, each { value, count }.

Build a request

GEThttps://miromiro.app/api/v1/v1/extract?url=stripe.com

urlrequired
format
fields

Nothing selected returns the full response.

Options at their default are left out of the URL - the API assumes them. Auth isn't shown here: send your key as an Authorization: Bearer header (see the example below).

Response

Authorization: Bearer mm_live_…
Response fields
urlstringThe resolved URL that was extracted.
colors[]arrayEvery color used, each { color, count, properties }, most-used first. properties lists the CSS properties the color appears on (color, background-color, border-color, …).
fontFamilies[]arrayFont families, each { family, count }.
fontSizes[]arrayFont sizes, each { size, count }.
fontWeights[]arrayFont weights, each { value, count }.
letterSpacings[]arrayLetter-spacing values, each { value, count }.
lineHeights[]arrayLine-height values, each { value, count }.
spacing[]arraySpacing scale from margin/padding/gap/inset, each { value, count }.
borderRadiuses[]arrayBorder radii, each { value, count }.
boxShadows[]arrayBox shadows, each { value, count }.
gradients[]arrayGradients, each { value, type, count }. type ∈ linear, radial, conic.
durations[]arrayAnimation/transition durations, each { value, count }.
easings[]arrayEasing curves (cubic-bezier/steps/keywords), each { value, count }.
textShadows[]arrayText shadows, each { value, count }.
borderWidths[]arrayBorder and outline widths, each { value, count }.
opacities[]arrayOpacity steps below 1, each { value, count }.
breakpoints[]arrayResponsive breakpoints recovered from @media min/max-width queries, ascending, each { value, count }.
zIndexes[]arrayz-index values, each { value, count }.
summaryobjectAggregate counts (uniqueColors, uniqueSpacing, cssSize, …). Always returned.
usageobjectMetering for this call: credits spent this month, your monthly cap (null = unlimited), credits remaining, what this call cost (0 on cache hits), and whether it was served from the 24-hour cache.

Example request

https://miromiro.app/api/v1/extract?url=stripe.com&access_key=mm_live_…