{ "schemaVersion": 1, "brandId": "spacex", "source": { "componentsHtml": "components.html", "tokensCss": "tokens.css" }, "fixture": { "title": "SpaceX — reference components", "description": "Reference fixture for design-systems/spacex. Pure black canvas, spectral white type, full-viewport cinematic sections, D-DIN industrial uppercase, ghost-button as the sole interactive element, zero shadows.", "styleBlockCount": 1, "selectorCount": 57, "classCount": 22, "elementCount": 25 }, "tokens": { "declared": [ "--accent", "--accent-active", "--accent-hover", "--accent-on", "--bg", "--border", "--border-soft", "--container-gutter-desktop", "--container-gutter-phone", "--container-gutter-tablet", "--container-max", "--danger", "--ease-standard", "--elev-flat", "--elev-raised", "--elev-ring", "--fg", "--fg-2", "--focus-ring", "--font-body", "--font-display", "--font-mono", "--leading-body", "--leading-tight", "--meta", "--motion-base", "--motion-fast", "--muted", "--radius-lg", "--radius-md", "--radius-pill", "--radius-sm", "--section-y-desktop", "--section-y-phone", "--section-y-tablet", "--space-1", "--space-12", "--space-2", "--space-3", "--space-4", "--space-5", "--space-6", "--space-8", "--success", "--surface", "--surface-warm", "--text-2xl", "--text-3xl", "--text-4xl", "--text-base", "--text-lg", "--text-sm", "--text-xl", "--text-xs", "--tracking-display", "--warn" ], "referenced": [ "--accent", "--accent-active", "--accent-hover", "--accent-on", "--bg", "--border", "--border-soft", "--container-gutter-desktop", "--container-gutter-phone", "--container-gutter-tablet", "--container-max", "--ease-standard", "--fg", "--focus-ring", "--font-body", "--font-display", "--font-mono", "--leading-body", "--leading-tight", "--motion-fast", "--muted", "--radius-pill", "--radius-sm", "--section-y-desktop", "--section-y-phone", "--section-y-tablet", "--space-12", "--space-2", "--space-3", "--space-4", "--space-5", "--space-6", "--space-8", "--surface", "--text-2xl", "--text-4xl", "--text-base", "--text-sm", "--text-xl", "--text-xs", "--tracking-display" ], "unusedDeclared": [ "--danger", "--elev-flat", "--elev-raised", "--elev-ring", "--fg-2", "--meta", "--motion-base", "--radius-lg", "--radius-md", "--space-1", "--success", "--surface-warm", "--text-3xl", "--text-lg", "--warn" ], "undeclaredReferenced": [] }, "selectors": [ ".body-muted", ".btn", ".btn-ghost", ".btn-ghost:active", ".btn-ghost:hover", ".btn-solid", ".btn-solid:active", ".btn-solid:hover", ".btn:focus-visible", ".caption-bold", ".container", ".eyebrow", ".feature a", ".feature a:hover", ".feature h3", ".feature p", ".feature-index", ".features-grid", ".features-grid > article", ".features-grid > article + article", ".field", ".field input", ".field input::placeholder", ".field input:focus-visible", ".field label", ".field-help", ".form", ".form-actions", ".form-row", ".hero", ".hero .lead", ".hero h1", ".hero-actions", ".hero-inner", ".icon", ".lead", ".mission-strip", ".mission-strip > *", ".mission-strip > * + *", ".mission-strip > *:nth-child(2n+1)", ".mission-strip dd", ".mission-strip dt", ".stack-3 > * + *", ".stack-4 > * + *", ".stack-6 > * + *", ".stack-8 > * + *", "*", "*::after", "*::before", "body", "h1", "h2", "h3", "html", "p", "section", "section + section" ], "classes": [ "body-muted", "btn", "btn-ghost", "caption-bold", "container", "eyebrow", "feature", "feature-index", "features-grid", "field", "field-help", "form", "form-actions", "form-row", "hero", "hero-actions", "hero-inner", "icon", "lead", "mission-strip", "stack-4", "stack-6" ], "elements": [ "a", "article", "body", "button", "code", "dd", "div", "dl", "dt", "form", "h1", "h2", "h3", "head", "html", "input", "label", "main", "meta", "p", "path", "section", "style", "svg", "title" ], "groups": [ { "id": "buttons", "label": "Buttons and calls to action", "present": true, "selectors": [ ".btn", ".btn-ghost", ".btn-ghost:active", ".btn-ghost:hover", ".btn-solid", ".btn-solid:active", ".btn-solid:hover", ".btn:focus-visible" ], "classes": [ "btn", "btn-ghost" ], "elements": [ "button" ], "tokenReferences": [ "--accent", "--accent-active", "--accent-hover", "--accent-on", "--focus-ring" ] }, { "id": "inputs", "label": "Form fields and controls", "present": true, "selectors": [ ".field", ".field input", ".field input::placeholder", ".field input:focus-visible", ".field label", ".field-help" ], "classes": [ "field", "field-help", "form", "form-actions", "form-row" ], "elements": [ "form", "input", "label" ], "tokenReferences": [ "--accent-hover", "--focus-ring", "--muted", "--text-xs" ] }, { "id": "cards", "label": "Cards and panels", "present": false, "selectors": [], "classes": [], "elements": [], "tokenReferences": [] }, { "id": "badges", "label": "Badges, chips, and status labels", "present": false, "selectors": [], "classes": [], "elements": [], "tokenReferences": [] }, { "id": "links", "label": "Links and inline actions", "present": true, "selectors": [ ".feature a", ".feature a:hover" ], "classes": [], "elements": [ "a" ], "tokenReferences": [ "--accent-hover" ] }, { "id": "keyboard", "label": "Keyboard hints", "present": false, "selectors": [], "classes": [], "elements": [], "tokenReferences": [] }, { "id": "icons", "label": "Icon slots", "present": true, "selectors": [ ".icon" ], "classes": [ "icon" ], "elements": [ "svg" ], "tokenReferences": [] }, { "id": "typography", "label": "Typography scale and text utilities", "present": true, "selectors": [ ".body-muted", ".eyebrow", ".feature h3", ".hero .lead", ".hero h1", ".lead", "h1", "h2", "h3" ], "classes": [ "body-muted", "caption-bold", "eyebrow", "lead" ], "elements": [ "h1", "h2", "h3", "p" ], "tokenReferences": [ "--font-display", "--leading-tight", "--muted", "--text-2xl", "--text-xs", "--tracking-display" ] }, { "id": "layout", "label": "Layout primitives", "present": true, "selectors": [ ".container", ".stack-3 > * + *", ".stack-4 > * + *", ".stack-6 > * + *", ".stack-8 > * + *", "section", "section + section" ], "classes": [ "container", "features-grid", "stack-4", "stack-6" ], "elements": [ "main", "section" ], "tokenReferences": [ "--border-soft", "--container-gutter-desktop", "--container-gutter-phone", "--container-gutter-tablet", "--container-max", "--space-4", "--space-8" ] } ], "literals": { "colorExpressions": 18, "pixelValues": 49, "hardcodedFontFamilies": 7 } }