{ "schemaVersion": 1, "brandId": "ollama", "source": { "componentsHtml": "components.html", "tokensCss": "tokens.css" }, "fixture": { "title": "Ollama — reference components", "description": "Reference fixture for design-systems/ollama. Every visible value comes from tokens.css; if the agent paste-replaces the :root block and reuses the component selectors below verbatim, the artifact passes lint without further audit.", "styleBlockCount": 1, "selectorCount": 70, "classCount": 34, "elementCount": 26 }, "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", "--container-gutter-desktop", "--container-gutter-phone", "--container-gutter-tablet", "--container-max", "--ease-standard", "--fg", "--fg-2", "--focus-ring", "--font-body", "--font-display", "--font-mono", "--leading-body", "--leading-tight", "--meta", "--motion-fast", "--muted", "--radius-md", "--radius-pill", "--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", "--surface", "--text-3xl", "--text-4xl", "--text-base", "--text-lg", "--text-sm", "--text-xl", "--text-xs", "--tracking-display" ], "unusedDeclared": [ "--border-soft", "--danger", "--elev-flat", "--elev-raised", "--elev-ring", "--motion-base", "--radius-lg", "--radius-sm", "--success", "--surface-warm", "--text-2xl", "--warn" ], "undeclaredReferenced": [] }, "selectors": [ ".body-muted", ".body-sm", ".btn", ".btn-gray", ".btn-gray:hover", ".btn-outline", ".btn-outline:hover", ".btn-primary", ".btn-primary:active", ".btn-primary:hover", ".btn:focus-visible", ".card", ".card h3", ".container", ".eyebrow", ".feature-icon", ".features-grid", ".field", ".field input", ".field input::placeholder", ".field input:focus-visible", ".field label", ".field-help", ".footnote", ".hero", ".hero .lead", ".hero h1", ".hero-actions", ".hero-terminal", ".lead", ".nav", ".nav-actions", ".nav-brand", ".nav-brand svg", ".nav-links", ".nav-links a", ".nav-signin", ".nav-spacer", ".signup", ".signup-form", ".signup-row", ".signup-row .field", ".stack-3 > * + *", ".stack-4 > * + *", ".stack-5 > * + *", ".stack-6 > * + *", ".tab", ".tab:focus-visible", ".tab[aria-selected=\"true\"]", ".tabs", ".tag", ".tag-row", ".terminal", ".terminal-cmd", ".terminal-copy", ".terminal-copy:focus-visible", ".terminal-copy:hover", ".terminal-prompt", "*", "*::after", "*::before", "a.text-link", "a.text-link:hover", "body", "h1", "h2", "h3", "html", "p", "section" ], "classes": [ "body-muted", "body-sm", "btn", "btn-gray", "btn-primary", "card", "container", "eyebrow", "feature-icon", "features-grid", "field", "field-help", "footnote", "hero", "hero-actions", "hero-terminal", "lead", "nav", "nav-actions", "nav-brand", "nav-links", "nav-signin", "nav-spacer", "signup", "signup-form", "signup-row", "stack-4", "tag", "tag-row", "terminal", "terminal-cmd", "terminal-copy", "terminal-prompt", "text-link" ], "elements": [ "a", "article", "body", "button", "circle", "div", "form", "h1", "h2", "h3", "head", "header", "html", "input", "label", "main", "meta", "nav", "p", "path", "rect", "section", "span", "style", "svg", "title" ], "groups": [ { "id": "buttons", "label": "Buttons and calls to action", "present": true, "selectors": [ ".btn", ".btn-gray", ".btn-gray:hover", ".btn-outline", ".btn-outline:hover", ".btn-primary", ".btn-primary:active", ".btn-primary:hover", ".btn:focus-visible" ], "classes": [ "btn", "btn-gray", "btn-primary" ], "elements": [ "button" ], "tokenReferences": [ "--accent-hover", "--bg", "--border", "--fg-2", "--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", ".signup-row .field" ], "classes": [ "field", "field-help", "signup-form" ], "elements": [ "form", "input", "label" ], "tokenReferences": [ "--bg", "--border", "--ease-standard", "--fg", "--focus-ring", "--motion-fast", "--radius-pill", "--space-2", "--space-5", "--text-base" ] }, { "id": "cards", "label": "Cards and panels", "present": true, "selectors": [ ".card", ".card h3" ], "classes": [ "card" ], "elements": [], "tokenReferences": [ "--bg", "--border", "--radius-md", "--space-3", "--space-6" ] }, { "id": "badges", "label": "Badges, chips, and status labels", "present": true, "selectors": [ ".tag", ".tag-row" ], "classes": [ "tag", "tag-row" ], "elements": [], "tokenReferences": [ "--border", "--fg-2", "--font-mono", "--radius-pill", "--space-3", "--text-xs" ] }, { "id": "links", "label": "Links and inline actions", "present": true, "selectors": [ ".nav-links a", "a.text-link", "a.text-link:hover" ], "classes": [], "elements": [ "a" ], "tokenReferences": [ "--border", "--fg", "--text-base" ] }, { "id": "keyboard", "label": "Keyboard hints", "present": false, "selectors": [], "classes": [], "elements": [], "tokenReferences": [] }, { "id": "icons", "label": "Icon slots", "present": true, "selectors": [], "classes": [], "elements": [ "svg" ], "tokenReferences": [] }, { "id": "typography", "label": "Typography scale and text utilities", "present": true, "selectors": [ ".body-muted", ".body-sm", ".card h3", ".eyebrow", ".hero .lead", ".hero h1", ".lead", "h1", "h2", "h3" ], "classes": [ "body-muted", "body-sm", "eyebrow", "lead" ], "elements": [ "h1", "h2", "h3", "p" ], "tokenReferences": [ "--fg", "--font-display", "--font-mono", "--leading-tight", "--muted", "--text-3xl", "--text-xs", "--tracking-display" ] }, { "id": "layout", "label": "Layout primitives", "present": true, "selectors": [ ".container", ".nav", ".nav-actions", ".nav-brand", ".nav-brand svg", ".nav-links", ".nav-links a", ".nav-signin", ".nav-spacer", ".stack-3 > * + *", ".stack-4 > * + *", ".stack-5 > * + *", ".stack-6 > * + *", "section" ], "classes": [ "container", "features-grid", "stack-4" ], "elements": [ "header", "main", "nav", "section" ], "tokenReferences": [ "--container-gutter-desktop", "--container-gutter-phone", "--container-gutter-tablet", "--container-max", "--fg", "--space-4", "--space-5", "--space-6", "--text-base" ] } ], "literals": { "colorExpressions": 2, "pixelValues": 22, "hardcodedFontFamilies": 10 } }