{
  "name": "Claymorphism",
  "version": 1,
  "meta": {
    "source": "github",
    "repo": "feimacode/open-design-agent-kit",
    "package": "claude-design-systems/claymorphism",
    "upstream": "open-design-v0.24.1",
    "synced": "2026-10-22"
  },
  "color": {
    "themes": [
      {
        "id": "light",
        "name": "Light"
      }
    ],
    "tokens": [
      {
        "name": "bg",
        "value": "#f7eee6",
        "usage": "Page background — defines the brand canvas."
      },
      {
        "name": "surface",
        "value": "#fff8f1",
        "usage": "Card / lifted container background."
      },
      {
        "name": "surface-warm",
        "value": "#ead6c7",
        "usage": "Tertiary surface tier (kami warm-sand)."
      },
      {
        "name": "fg",
        "value": "#2b211c",
        "usage": "Primary text on `bg` and `surface`."
      },
      {
        "name": "fg-2",
        "value": "#5a4b43",
        "usage": "Secondary text on `bg` and `surface`."
      },
      {
        "name": "muted",
        "value": "#8a7a70",
        "usage": "Subtext and captions on `bg` and `surface`. Below 4.5:1 on `bg` (3.59:1), as the brand has it. Below 4.5:1 on `surface` (3.91:1), as the brand has it."
      },
      {
        "name": "meta",
        "value": "#b46a46",
        "usage": "Tertiary FG / metadata tier (kami stone)."
      },
      {
        "name": "border",
        "value": "#dac8b9",
        "usage": "Default border / card edge."
      },
      {
        "name": "border-soft",
        "value": "#eaded4",
        "usage": "Inner row separator that should not visually compete."
      },
      {
        "name": "accent",
        "value": "#b46a46",
        "usage": "Brand accent. ≤2 visible uses per screen (lint enforced)."
      },
      {
        "name": "accent-on",
        "value": "#ffffff",
        "usage": "Text and icons on `accent` fills. Below 4.5:1 on `accent` (4.13:1), as the brand has it."
      },
      {
        "name": "accent-hover",
        "value": "#a15e3e",
        "usage": "Hover state for elements using --accent as bg."
      },
      {
        "name": "accent-active",
        "value": "#935538",
        "usage": "Active state for elements using --accent as bg."
      },
      {
        "name": "success",
        "value": "#4d8f5a",
        "usage": "Success state."
      },
      {
        "name": "warn",
        "value": "#c88735",
        "usage": "Warning state."
      },
      {
        "name": "danger",
        "value": "#b84c4c",
        "usage": "Danger state."
      }
    ]
  },
  "type": {
    "fonts": [],
    "families": {
      "display": "Poppins, system-ui, sans-serif",
      "body": "Montserrat, system-ui, sans-serif",
      "mono": "\"JetBrains Mono\", ui-monospace, Menlo, monospace"
    },
    "groups": [
      {
        "name": "Display",
        "family": "display",
        "styles": [
          {
            "name": "text-xl",
            "fontSize": "24px",
            "lineHeight": 1.06,
            "letterSpacing": "-0.025em",
            "usage": "Type scale step — H2."
          },
          {
            "name": "text-2xl",
            "fontSize": "36px",
            "lineHeight": 1.06,
            "letterSpacing": "-0.025em",
            "usage": "Type scale step — section title."
          },
          {
            "name": "text-3xl",
            "fontSize": "54px",
            "lineHeight": 1.06,
            "letterSpacing": "-0.025em",
            "usage": "Type scale step — H1."
          },
          {
            "name": "text-4xl",
            "fontSize": "76px",
            "lineHeight": 1.06,
            "letterSpacing": "-0.025em",
            "usage": "Type scale step — display / hero."
          }
        ]
      },
      {
        "name": "Text",
        "family": "body",
        "styles": [
          {
            "name": "text-xs",
            "fontSize": "12px",
            "lineHeight": 1.52,
            "usage": "Type scale step — extra small (≈11–12px)."
          },
          {
            "name": "text-sm",
            "fontSize": "14px",
            "lineHeight": 1.52,
            "usage": "Type scale step — small (≈12–14px)."
          },
          {
            "name": "text-base",
            "fontSize": "16px",
            "lineHeight": 1.52,
            "usage": "Type scale step — body baseline."
          },
          {
            "name": "text-lg",
            "fontSize": "18px",
            "lineHeight": 1.52,
            "usage": "Type scale step — H3 / featured body."
          }
        ]
      }
    ]
  },
  "spacing": {
    "tokens": [
      {
        "name": "space-1",
        "value": "4px",
        "usage": "Base spacing — 4px tier."
      },
      {
        "name": "space-2",
        "value": "8px",
        "usage": "Base spacing — 8px tier."
      },
      {
        "name": "space-3",
        "value": "12px",
        "usage": "Base spacing — 12px tier."
      },
      {
        "name": "space-4",
        "value": "16px",
        "usage": "Base spacing — 16px tier."
      },
      {
        "name": "space-5",
        "value": "20px",
        "usage": "Base spacing — 20px tier."
      },
      {
        "name": "space-6",
        "value": "24px",
        "usage": "Base spacing — 24px tier."
      },
      {
        "name": "space-8",
        "value": "32px",
        "usage": "Base spacing — 32px tier."
      },
      {
        "name": "space-12",
        "value": "48px",
        "usage": "Base spacing — 48px tier."
      },
      {
        "name": "section-y-desktop",
        "value": "96px",
        "usage": "Vertical padding between sections — desktop."
      },
      {
        "name": "section-y-tablet",
        "value": "68px",
        "usage": "Vertical padding between sections — tablet."
      },
      {
        "name": "section-y-phone",
        "value": "48px",
        "usage": "Vertical padding between sections — phone."
      },
      {
        "name": "container-max",
        "value": "1180px",
        "usage": "Max content container width."
      },
      {
        "name": "container-gutter-desktop",
        "value": "36px",
        "usage": "Container side gutter — desktop."
      },
      {
        "name": "container-gutter-tablet",
        "value": "24px",
        "usage": "Container side gutter — tablet."
      },
      {
        "name": "container-gutter-phone",
        "value": "16px",
        "usage": "Container side gutter — phone."
      }
    ]
  },
  "radius": {
    "tokens": [
      {
        "name": "radius-sm",
        "value": "14px",
        "usage": "Small radius — buttons, inputs, chips."
      },
      {
        "name": "radius-md",
        "value": "22px",
        "usage": "Medium radius — cards, modals."
      },
      {
        "name": "radius-lg",
        "value": "34px",
        "usage": "Large radius — featured containers."
      },
      {
        "name": "radius-pill",
        "value": "9999px",
        "usage": "Pill radius — avatars, badges."
      }
    ]
  },
  "shadow": {
    "tokens": [
      {
        "name": "elev-flat",
        "value": "none",
        "usage": "No elevation."
      },
      {
        "name": "elev-ring",
        "value": "0 0 0 1px #dac8b9",
        "usage": "Hairline ring (1px box-shadow border)."
      },
      {
        "name": "elev-raised",
        "value": "8px 10px 24px rgba(128, 92, 70, 0.18), -8px -8px 20px rgba(255, 255, 255, 0.70)",
        "usage": "Raised surface (blur or whisper)."
      },
      {
        "name": "focus-ring",
        "value": "0 0 0 4px rgba(180, 106, 70, 0.24)",
        "usage": "Keyboard focus indicator."
      }
    ]
  },
  "typeMetrics": {
    "note": "Line heights and tracking from the Open Design token contract.",
    "tokens": [
      {
        "name": "leading-body",
        "value": "1.52",
        "usage": "Line-height for reading body."
      },
      {
        "name": "leading-tight",
        "value": "1.06",
        "usage": "Line-height for headings."
      },
      {
        "name": "tracking-display",
        "value": "-0.025em",
        "usage": "Letter-spacing applied to display sizes."
      }
    ]
  }
}
