{
  "$schema": "https://mian.ro/schema/v2/registry.json",
  "schemaVersion": "2.0.0",
  "generatedAt": "2026-10-02T13:14:06.957Z",
  "id": "dangmyeon",
  "name": "Dangmyeon",
  "family": "Glass",
  "origin": "Korea · sweet-potato glass noodles",
  "tagline": "Smoked glass, sesame gloss.",
  "description": "Dangmyeon are Korean sweet-potato starch noodles: grey-brown and translucent, chewy, glossy with sesame oil and tossed with bright julienned vegetables in japchae. Dangmyeon is a smoked-glass system: dark tinted translucent panels with an amber sheen, and the vegetables’ colours as accents.",
  "inspiration": [
    "Grey-brown, translucent → smoked, tinted glass panels rather than clear ones",
    "Glossy with sesame oil → a warm amber sheen along edges and on hover",
    "Tossed with carrot, spinach, egg and mushroom → a bright julienne palette for charts and status",
    "Chewy and springy → soft, slightly elastic motion"
  ],
  "traits": {
    "mood": [
      "smoked",
      "glossy",
      "moody",
      "premium",
      "dark"
    ],
    "intensity": 3,
    "contrast": "medium",
    "geometry": "soft radius",
    "type": "sans",
    "surface": "smoked glass",
    "motion": "smooth",
    "goodFor": [
      "nightlife",
      "music",
      "premium apps",
      "bars and restaurants"
    ],
    "lessFor": [
      "children",
      "public services"
    ],
    "density": "default"
  },
  "license": "LicenseRef-MIAN-1.0",
  "designLanguage": {
    "essence": "Dangmyeon is smoked glass. Sweet-potato noodles are grey-brown and translucent, glossy with sesame oil and tossed with bright vegetables, so the interface uses tinted, smoky translucent panels with a thicker glass edge at the bottom, a warm amber sheen that slides across when you hover, and the vegetables’ colours, carrot, spinach, egg yolk, for data.",
    "principles": [
      "Tinted, not clear: panels are smoke-tinted glass (--d-smoke) with blur.",
      "A thicker bottom edge: inset 0 -3px 0 of the tint, a bright top edge (--d-edge).",
      "Sesame sheen: a diagonal amber highlight slides across buttons and rows on hover.",
      "Julienne colours for data and status, never for surfaces."
    ],
    "aspects": {
      "Shape": "12px fields, 18px panels, pill badges.",
      "Surface": "Smoked translucent glass over a warm gradient; soft deep shadows.",
      "Colour": "Sesame-amber primary, spinach green accent; carrot, egg and mushroom series colours.",
      "Type": "Sans at 650–700.",
      "Motion": "dangmyeon-in: rise with a little blur and spring, 320ms; the sheen travels 600ms.",
      "Data": "Glossy tinted bars cycling through four julienne colours; a four-colour spinner."
    },
    "extend": [
      "background-color: var(--d-smoke); backdrop-filter: var(--d-blur); box-shadow: var(--d-edge).",
      "Add a ::before with var(--d-sheen) (background-size 250%) and move its background-position on hover.",
      "Colour data with --mn-series-1…4 (amber, green, yolk, carrot)."
    ],
    "avoid": [
      "Clear or white glass",
      "Cold blue tints",
      "Flat opaque panels"
    ],
    "recipe": "[data-noodle=\"dangmyeon\"] .tile {\n  position: relative; overflow: hidden; padding: 14px 16px; border: 1px solid light-dark(rgb(90 70 50 / .14), rgb(255 255 255 / .07)); border-radius: 18px;\n  background-color: var(--d-smoke); -webkit-backdrop-filter: var(--d-blur); backdrop-filter: var(--d-blur); box-shadow: var(--d-edge);\n}\n[data-noodle=\"dangmyeon\"] .tile::before { content: \"\"; position: absolute; inset: 0; background: var(--d-sheen) 120% 0 / 250% 100% no-repeat; transition: background-position 600ms; }\n[data-noodle=\"dangmyeon\"] .tile:hover::before { background-position: -20% 0; }"
  },
  "psychology": {
    "temperature": "warm",
    "colours": [
      {
        "role": "Primary",
        "hex": "#a14a0d",
        "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": "Accent",
        "hex": "#3f6212",
        "family": "Green",
        "depth": "deep",
        "says": "Growth, health, permission, money. The easiest colour to look at for a long time.",
        "use": "Finance, health, food, sustainability, and “go” or success states.",
        "risk": "Success messages are green too: a green brand needs a success state that is clearly a status (icon, words). Claims of sustainability made with green alone read as greenwashing."
      },
      {
        "role": "Page",
        "hex": "#e7e3dd",
        "family": "Brown and terracotta",
        "depth": "pale, muted",
        "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."
      }
    ],
    "relation": "Brown and terracotta with green: a contrasting pair that needs one of the two to dominate.",
    "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": 700,
      "summary": "One voice throughout: neutral sans. Headings are semibold, which reads as confident without shouting."
    },
    "personality": {
      "reads": [
        "smoked",
        "glossy",
        "moody",
        "premium",
        "dark"
      ],
      "intensity": 3,
      "dimensions": [],
      "suits": [
        "nightlife",
        "music",
        "premium apps",
        "bars and restaurants"
      ],
      "lessFor": [
        "children",
        "public services"
      ],
      "tone": "Lively. A point of view in the headline, concrete verbs, a little humour where it is true."
    },
    "logo": "A simple geometric mark with slightly softened corners fits; avoid both hard spikes and full circles."
  },
  "url": "https://mian.ro/noodles/dangmyeon",
  "markdownUrl": "https://mian.ro/ai/noodles/dangmyeon.md",
  "stylesheet": "https://mian.ro/dist/noodles/dangmyeon.css",
  "usage": "<html data-noodle=\"dangmyeon\">",
  "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": 700,
  "radius": {
    "field": "12px",
    "box": "18px",
    "badge": "999px"
  },
  "shadow": "soft",
  "density": "default",
  "glass": true,
  "light": {
    "bg": "#e7e3dd",
    "surface": "#faf8f5",
    "surface2": "#dcd6ce",
    "fg": "#1d1915",
    "muted": "#5b5249",
    "border": "#cdc5ba",
    "input": "#a99f92",
    "primary": "#a14a0d",
    "primaryFg": "#ffffff",
    "secondary": "#dcd6ce",
    "secondaryFg": "#1d1915",
    "accent": "#3f6212",
    "accentFg": "#ffffff",
    "ring": "#a14a0d",
    "success": "#15803d",
    "successFg": "#ffffff",
    "warning": "#b45309",
    "warningFg": "#ffffff",
    "danger": "#dc2626",
    "dangerFg": "#ffffff",
    "info": "#0369a1",
    "infoFg": "#ffffff",
    "primaryText": "#a14a0d",
    "secondaryText": "#69655f",
    "accentText": "#3f6212",
    "successText": "#167438",
    "warningText": "#a24c0a",
    "dangerText": "#c12424",
    "infoText": "#0369a1",
    "link": "#a14a0d"
  },
  "dark": {
    "bg": "#0f0d0b",
    "surface": "#1b1815",
    "surface2": "#26221e",
    "fg": "#f1ebe3",
    "muted": "#a8998a",
    "border": "#3a332c",
    "input": "#564c42",
    "primary": "#f5a524",
    "primaryFg": "#1f1300",
    "secondary": "#26221e",
    "secondaryFg": "#f1ebe3",
    "accent": "#a3d65c",
    "accentFg": "#132203",
    "ring": "#f5a524",
    "success": "#4ade80",
    "successFg": "#052e16",
    "warning": "#fbbf24",
    "warningFg": "#1f1300",
    "danger": "#f87171",
    "dangerFg": "#210505",
    "info": "#38bdf8",
    "infoFg": "#03202d",
    "primaryText": "#f5a524",
    "secondaryText": "#87827d",
    "accentText": "#a3d65c",
    "successText": "#4ade80",
    "warningText": "#fbbf24",
    "dangerText": "#f87171",
    "infoText": "#38bdf8",
    "link": "#f5a524"
  },
  "css": "[data-noodle=\"dangmyeon\"] {\n  --mn-bg: light-dark(#e7e3dd, #0f0d0b);\n  --mn-surface: light-dark(#faf8f5, #1b1815);\n  --mn-surface-2: light-dark(#dcd6ce, #26221e);\n  --mn-fg: light-dark(#1d1915, #f1ebe3);\n  --mn-muted: light-dark(#5b5249, #a8998a);\n  --mn-border: light-dark(#cdc5ba, #3a332c);\n  --mn-input: light-dark(#a99f92, #564c42);\n  --mn-primary: light-dark(#a14a0d, #f5a524);\n  --mn-primary-fg: light-dark(#ffffff, #1f1300);\n  --mn-secondary: light-dark(#dcd6ce, #26221e);\n  --mn-secondary-fg: light-dark(#1d1915, #f1ebe3);\n  --mn-accent: light-dark(#3f6212, #a3d65c);\n  --mn-accent-fg: light-dark(#ffffff, #132203);\n  --mn-ring: light-dark(#a14a0d, #f5a524);\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(#a14a0d, #f5a524);\n  --mn-secondary-text: light-dark(#69655f, #87827d);\n  --mn-accent-text: light-dark(#3f6212, #a3d65c);\n  --mn-success-text: light-dark(#167438, #4ade80);\n  --mn-warning-text: light-dark(#a24c0a, #fbbf24);\n  --mn-danger-text: light-dark(#c12424, #f87171);\n  --mn-info-text: light-dark(#0369a1, #38bdf8);\n  --mn-link: light-dark(#a14a0d, #f5a524);\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: 700;\n  --mn-radius-field: 12px;\n  --mn-radius-box: 18px;\n  --mn-radius-badge: 999px;\n  --mn-shadow-sm: 0 1px 3px rgb(0 0 0 / .08);\n  --mn-shadow-md: 0 4px 14px -4px rgb(0 0 0 / .12), 0 2px 4px -2px rgb(0 0 0 / .06);\n  --mn-shadow-lg: 0 20px 48px -12px rgb(0 0 0 / .25), 0 8px 16px -8px rgb(0 0 0 / .10);\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: 72%;\n  --mn-backdrop: blur(18px) saturate(1.4);\n  --mn-bg-image: radial-gradient(800px 500px at 0% 0%, light-dark(#d8c7ad, #3a2a14) 0%, transparent 60%), radial-gradient(700px 500px at 100% 100%, light-dark(#c9d4b6, #1f2a12) 0%, transparent 60%);\n}\n"
}
