{
  "$schema": "https://mian.ro/schema/v2/registry.json",
  "schemaVersion": "2.0.0",
  "generatedAt": "2026-10-02T13:14:06.957Z",
  "id": "sanuki",
  "name": "Sanuki",
  "family": "Linear",
  "origin": "Japan · Kagawa",
  "tagline": "Square-cut, firm, exact.",
  "description": "Sanuki udon from Kagawa is cut square, with sharp edges and a firm, springy bite. Sanuki is a rigid, square system: no radius anywhere, 2px straight lines, chunky square controls and a snap to every movement.",
  "inspiration": [
    "Cut square with sharp edges → zero radius on everything, including checkboxes, switches and avatars",
    "Thick and firm → 2px lines, heavy square blocks, chunky controls",
    "A firm bite (koshi) → motion that snaps into place with no easing tail",
    "Kagawa indigo noren → deep indigo primary on wheat white"
  ],
  "traits": {
    "mood": [
      "square",
      "firm",
      "exact",
      "industrial",
      "serious"
    ],
    "intensity": 2,
    "contrast": "high",
    "geometry": "no radius anywhere, 2px lines",
    "type": "sans, firm",
    "surface": "flat, bordered",
    "motion": "instant",
    "goodFor": [
      "engineering",
      "architecture",
      "industrial",
      "b2b tools"
    ],
    "lessFor": [
      "soft consumer",
      "wellness"
    ],
    "density": "default"
  },
  "license": "LicenseRef-MIAN-1.0",
  "designLanguage": {
    "essence": "Sanuki is cut square and has a firm bite. The interface has no radius anywhere, not on buttons, checkboxes, switches, avatars or charts, and is drawn with 2px ink lines and chunky square blocks with hard 4px offset shadows. Motion snaps into place with no easing tail, like a firm noodle springing back.",
    "principles": [
      "Zero radius, always.",
      "2px ink lines everywhere (--mn-border-w: 2px; borders in var(--mn-fg)).",
      "Blocks with hard shadows (4px 4px 0 ink) that press flat when clicked.",
      "Snap motion: 90ms, cubic-bezier(.9,0,.1,1) or steps().",
      "Heavy (800) type, uppercase table headers."
    ],
    "aspects": {
      "Shape": "Square everything; square switch knob and slider thumb; square radial.",
      "Surface": "Wheat-white surfaces with 2px ink borders and 4–6px hard offset shadows.",
      "Colour": "Indigo primary, amber accent, ink and wheat.",
      "Type": "Sans at 800, tight tracking; uppercase table headers.",
      "Motion": "sanuki-in: a stepped reveal (steps(4)) in 140ms; presses translate 4px into the shadow.",
      "Data": "Square outlined bars packed tight; square legend keys."
    },
    "extend": [
      "border: 2px solid var(--mn-fg); border-radius: 0; box-shadow: 4px 4px 0 var(--mn-fg).",
      "Press: transform: translate(4px, 4px); box-shadow: none, in 90ms.",
      "Selected = inverted (ink fill, paper text)."
    ],
    "avoid": [
      "Any border-radius",
      "Soft or blurred shadows",
      "Thin 1px lines",
      "Eased or springy motion"
    ],
    "recipe": "[data-noodle=\"sanuki\"] .tile {\n  padding: 14px 16px; border: 2px solid var(--mn-fg); border-radius: 0;\n  background: var(--mn-surface); box-shadow: 4px 4px 0 var(--mn-fg); font-weight: 800;\n  transition: transform 90ms cubic-bezier(.9, 0, .1, 1), box-shadow 90ms cubic-bezier(.9, 0, .1, 1);\n}\n[data-noodle=\"sanuki\"] .tile:active { transform: translate(4px, 4px); box-shadow: 0 0 0 var(--mn-fg); }\n[data-noodle=\"sanuki\"] .tile[aria-selected=\"true\"] { background: var(--mn-fg); color: var(--mn-bg); }"
  },
  "psychology": {
    "temperature": "warm",
    "colours": [
      {
        "role": "Primary",
        "hex": "#1e3a8a",
        "family": "Blue",
        "depth": "mid",
        "says": "Trust, competence, calm, distance. The world’s most-liked colour and the default of banks, software and social networks.",
        "use": "Finance, enterprise, health, anything that must feel safe. Links are expected to be blue.",
        "risk": "The safest choice is also the least memorable. A blue brand is told apart by its typography, shape and tone of voice, not by its blue."
      },
      {
        "role": "Accent",
        "hex": "#b45309",
        "family": "Brown and terracotta",
        "depth": "mid, saturated",
        "says": "Earth, craft, reliability, age. Feels made by hand and unhurried.",
        "use": "Food, coffee, leather, ceramics, heritage brands, anything artisanal.",
        "risk": "Looks dull on screens unless the neutrals around it are warm too."
      },
      {
        "role": "Page",
        "hex": "#f7f6f2",
        "family": "Yellow and gold",
        "depth": "pale, muted",
        "says": "Optimism, attention, caution. Gold tones add value and ceremony.",
        "use": "Highlights, warnings, playful consumer brands; gold for luxury and awards.",
        "risk": "The lightest hue: white text on yellow fails, so yellow always carries dark text. Large yellow areas tire the eye."
      }
    ],
    "relation": "Blue against brown and terracotta, close to complementary: strong contrast, so the accent must stay rare.",
    "type": {
      "body": {
        "class": "neutral",
        "name": "Neutral sans",
        "says": "Clear, modern, impartial. The voice of software and signage.",
        "use": "Interfaces, documentation, most product marketing.",
        "risk": "The same few neutral sans typefaces set every generated page. Without a distinct weight, size or pairing it reads as a template."
      },
      "heading": {
        "class": "neutral",
        "name": "Neutral sans",
        "says": "Clear, modern, impartial. The voice of software and signage.",
        "use": "Interfaces, documentation, most product marketing.",
        "risk": "The same few neutral sans typefaces set every generated page. Without a distinct weight, size or pairing it reads as a template."
      },
      "weight": 800,
      "summary": "One voice throughout: neutral sans. Headings are heavy, which reads as loud and direct."
    },
    "personality": {
      "reads": [
        "square",
        "firm",
        "exact",
        "industrial",
        "serious"
      ],
      "intensity": 2,
      "dimensions": [
        "Ruggedness"
      ],
      "suits": [
        "engineering",
        "architecture",
        "industrial",
        "b2b tools"
      ],
      "lessFor": [
        "soft consumer",
        "wellness"
      ],
      "tone": "Calm and clear. Short sentences, one idea each, a friendly but not chatty register."
    },
    "logo": "Square and angular marks fit: a wordmark in capitals or a solid block symbol. Use a heavy wordmark; a thin one would vanish beside these headings."
  },
  "url": "https://mian.ro/noodles/sanuki",
  "markdownUrl": "https://mian.ro/ai/noodles/sanuki.md",
  "stylesheet": "https://mian.ro/dist/noodles/sanuki.css",
  "usage": "<html data-noodle=\"sanuki\">",
  "fonts": {
    "sans": "ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif",
    "heading": "ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif",
    "mono": "ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace"
  },
  "headingWeight": 800,
  "radius": {
    "field": "0px",
    "box": "0px",
    "badge": "0px"
  },
  "shadow": "none",
  "density": "default",
  "glass": false,
  "light": {
    "bg": "#f7f6f2",
    "surface": "#ffffff",
    "surface2": "#eeece6",
    "fg": "#121212",
    "muted": "#595650",
    "border": "#121212",
    "input": "#121212",
    "primary": "#1e3a8a",
    "primaryFg": "#ffffff",
    "secondary": "#eeece6",
    "secondaryFg": "#121212",
    "accent": "#b45309",
    "accentFg": "#ffffff",
    "ring": "#1e3a8a",
    "success": "#15803d",
    "successFg": "#ffffff",
    "warning": "#b45309",
    "warningFg": "#ffffff",
    "danger": "#dc2626",
    "dangerFg": "#ffffff",
    "info": "#0369a1",
    "infoFg": "#ffffff",
    "primaryText": "#1e3a8a",
    "secondaryText": "#6e6e6b",
    "accentText": "#aa4f0a",
    "successText": "#15793a",
    "warningText": "#aa4f0a",
    "dangerText": "#c82424",
    "infoText": "#0369a1",
    "link": "#1e3a8a"
  },
  "dark": {
    "bg": "#0e0e0d",
    "surface": "#161615",
    "surface2": "#21201e",
    "fg": "#f2f1ec",
    "muted": "#a8a59c",
    "border": "#f2f1ec",
    "input": "#f2f1ec",
    "primary": "#93b4ff",
    "primaryFg": "#0b1633",
    "secondary": "#21201e",
    "secondaryFg": "#f2f1ec",
    "accent": "#f59e0b",
    "accentFg": "#1f1300",
    "ring": "#93b4ff",
    "success": "#4ade80",
    "successFg": "#052e16",
    "warning": "#fbbf24",
    "warningFg": "#1f1300",
    "danger": "#f87171",
    "dangerFg": "#210505",
    "info": "#38bdf8",
    "infoFg": "#03202d",
    "primaryText": "#93b4ff",
    "secondaryText": "#81807d",
    "accentText": "#f59e0b",
    "successText": "#4ade80",
    "warningText": "#fbbf24",
    "dangerText": "#f87171",
    "infoText": "#38bdf8",
    "link": "#93b4ff"
  },
  "css": "[data-noodle=\"sanuki\"] {\n  --mn-bg: light-dark(#f7f6f2, #0e0e0d);\n  --mn-surface: light-dark(#ffffff, #161615);\n  --mn-surface-2: light-dark(#eeece6, #21201e);\n  --mn-fg: light-dark(#121212, #f2f1ec);\n  --mn-muted: light-dark(#595650, #a8a59c);\n  --mn-border: light-dark(#121212, #f2f1ec);\n  --mn-input: light-dark(#121212, #f2f1ec);\n  --mn-primary: light-dark(#1e3a8a, #93b4ff);\n  --mn-primary-fg: light-dark(#ffffff, #0b1633);\n  --mn-secondary: light-dark(#eeece6, #21201e);\n  --mn-secondary-fg: light-dark(#121212, #f2f1ec);\n  --mn-accent: light-dark(#b45309, #f59e0b);\n  --mn-accent-fg: light-dark(#ffffff, #1f1300);\n  --mn-ring: light-dark(#1e3a8a, #93b4ff);\n  --mn-success: light-dark(#15803d, #4ade80);\n  --mn-success-fg: light-dark(#ffffff, #052e16);\n  --mn-warning: light-dark(#b45309, #fbbf24);\n  --mn-warning-fg: light-dark(#ffffff, #1f1300);\n  --mn-danger: light-dark(#dc2626, #f87171);\n  --mn-danger-fg: light-dark(#ffffff, #210505);\n  --mn-info: light-dark(#0369a1, #38bdf8);\n  --mn-info-fg: light-dark(#ffffff, #03202d);\n  --mn-primary-text: light-dark(#1e3a8a, #93b4ff);\n  --mn-secondary-text: light-dark(#6e6e6b, #81807d);\n  --mn-accent-text: light-dark(#aa4f0a, #f59e0b);\n  --mn-success-text: light-dark(#15793a, #4ade80);\n  --mn-warning-text: light-dark(#aa4f0a, #fbbf24);\n  --mn-danger-text: light-dark(#c82424, #f87171);\n  --mn-info-text: light-dark(#0369a1, #38bdf8);\n  --mn-link: light-dark(#1e3a8a, #93b4ff);\n  --mn-font: ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n  --mn-font-heading: ui-sans-serif, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif;\n  --mn-font-mono: ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace;\n  --mn-heading-weight: 800;\n  --mn-radius-field: 0px;\n  --mn-radius-box: 0px;\n  --mn-radius-badge: 0px;\n  --mn-shadow-sm: none;\n  --mn-shadow-md: none;\n  --mn-shadow-lg: none;\n  --mn-size-xs: 26px;\n  --mn-size-sm: 32px;\n  --mn-size-md: 38px;\n  --mn-size-lg: 46px;\n  --mn-text-sm: 14px;\n  --mn-surface-alpha: 100%;\n  --mn-backdrop: none;\n  --mn-bg-image: none;\n}\n"
}