{
  "$schema": "https://design-tokens.github.io/community-group/format/",
  "name": "DUDE International v4",
  "source": "https://brandidentitykit.dudeinternational.com/",
  "color": {
    "brand": {
      "hot-pink": {
        "$type": "color",
        "$value": "#F8157F",
        "token": "--pink",
        "role": "Signature color. Wordmark \"International\", nav underline, Brief numbers, hard shadows in dark mode, selection. Large text and graphics only on light surfaces."
      },
      "accent-pink": {
        "$type": "color",
        "$value": "#C8106A",
        "dark": "#FF4D97",
        "token": "--accent",
        "role": "Text-safe pink. Kickers, links on hover, contents numbers, small pink text."
      },
      "pink-block": {
        "$type": "color",
        "$value": "#C8106A",
        "token": "--pinkbg",
        "role": "Solid pink fills with white text: tags, takeaways block, ticker label."
      },
      "ultraviolet": {
        "$type": "color",
        "$value": "#7733FF",
        "token": "--uv",
        "role": "Focus rings, active What's News tab, radar rule, the second brand accent."
      },
      "violet-named-teal": {
        "$type": "color",
        "$value": "#5A22D8",
        "dark": "#AE8FFF",
        "token": "--teal",
        "role": "Text-safe violet for \"Read\" badges and secondary links. The token is named teal in code but the value is violet."
      },
      "void": {
        "$type": "color",
        "$value": "#0B0B0F",
        "token": "--void",
        "role": "Masthead, section nav, footer, dark panels. Never changes with theme."
      },
      "void-2": {
        "$type": "color",
        "$value": "#15151C",
        "token": "--void2",
        "role": "Raised surface on void."
      },
      "gold": {
        "$type": "color",
        "$value": "#E09A00",
        "dark": "#FFC23D",
        "token": "--gold",
        "role": "Charts and small highlights. Not for text on light surfaces."
      }
    },
    "surface": {
      "paper": {
        "$type": "color",
        "$value": "#F9F9F9",
        "dark": "#0B0B0F",
        "name": "Paper",
        "role": "Page background."
      },
      "card": {
        "$type": "color",
        "$value": "#FFFFFF",
        "dark": "#15151C",
        "name": "Card",
        "role": "Cards and panels."
      },
      "card2": {
        "$type": "color",
        "$value": "#F0EFF4",
        "dark": "#1F1F29",
        "name": "Card 2",
        "role": "Tab tracks and quiet fills."
      },
      "ink": {
        "$type": "color",
        "$value": "#0B0B0F",
        "dark": "#F4F4F7",
        "name": "Ink",
        "role": "Primary text, 4px rules, hard shadows in light mode."
      },
      "ink2": {
        "$type": "color",
        "$value": "#2A2A33",
        "dark": "#D3D3DC",
        "name": "Ink 2",
        "role": "Secondary body text."
      },
      "muted": {
        "$type": "color",
        "$value": "#5C5C69",
        "dark": "#A3A3B2",
        "name": "Muted",
        "role": "Meta lines, captions, timestamps."
      },
      "rule": {
        "$type": "color",
        "$value": "#D6D5DE",
        "dark": "#33333F",
        "name": "Rule",
        "role": "Borders and dividers."
      },
      "hair": {
        "$type": "color",
        "$value": "#E7E6EC",
        "dark": "#24242E",
        "name": "Hairline",
        "role": "Hairlines, chart grids, bar tracks."
      },
      "blush": {
        "$type": "color",
        "$value": "#FFE6F0",
        "dark": "#2B0F1E",
        "name": "Blush",
        "role": "Hover fill for chips and contents rows."
      },
      "tealbg": {
        "$type": "color",
        "$value": "#F0EAFF",
        "dark": "#1B1530",
        "name": "Violet wash",
        "role": "Background of the \"Read\" badge."
      },
      "up": {
        "$type": "color",
        "$value": "#0B8043",
        "dark": "#3DD68C",
        "name": "Up",
        "role": "Market gains."
      },
      "dn": {
        "$type": "color",
        "$value": "#D42A1F",
        "dark": "#FF6B5E",
        "name": "Down",
        "role": "Market losses."
      }
    },
    "desk": {
      "ai": {
        "$type": "color",
        "$value": "#6A2BEA",
        "name": "AI & Agents"
      },
      "search": {
        "$type": "color",
        "$value": "#1F5FBF",
        "name": "Search, SEO & Answer Engines"
      },
      "commerce": {
        "$type": "color",
        "$value": "#B4541A",
        "name": "Amazon, Ecommerce & Retail"
      },
      "cpg": {
        "$type": "color",
        "$value": "#C8106A",
        "name": "CPG & Brands"
      },
      "startups": {
        "$type": "color",
        "$value": "#0B7A4B",
        "name": "Startups & Funding"
      },
      "markets": {
        "$type": "color",
        "$value": "#0B6E66",
        "name": "Markets"
      },
      "tesla": {
        "$type": "color",
        "$value": "#C0261B",
        "name": "Tesla"
      },
      "kentucky": {
        "$type": "color",
        "$value": "#1D3F8F",
        "name": "Kentucky Corner"
      },
      "india": {
        "$type": "color",
        "$value": "#A25A00",
        "name": "India"
      }
    },
    "event": {
      "launch": {
        "$type": "color",
        "$value": "#2457C5",
        "name": "Launch"
      },
      "funding": {
        "$type": "color",
        "$value": "#0B7A4B",
        "name": "Funding"
      },
      "m-and-a": {
        "$type": "color",
        "$value": "#6A2BEA",
        "name": "M&A"
      },
      "retail": {
        "$type": "color",
        "$value": "#B4541A",
        "name": "Retail"
      },
      "leadership": {
        "$type": "color",
        "$value": "#7A5A00",
        "name": "Leadership"
      },
      "marketing": {
        "$type": "color",
        "$value": "#C8106A",
        "name": "Marketing"
      },
      "recall": {
        "$type": "color",
        "$value": "#C0261B",
        "name": "Recall"
      },
      "earnings": {
        "$type": "color",
        "$value": "#3F4553",
        "name": "Earnings"
      },
      "default": {
        "$type": "color",
        "$value": "#374151",
        "name": "Other"
      }
    },
    "support": {
      "lilac-hover": {
        "$type": "color",
        "$value": "#B48CFF",
        "role": "Nameplate \"International\" on hover."
      },
      "masthead-pink": {
        "$type": "color",
        "$value": "#FF5CA2",
        "role": "Italic notes on void (dateline, meta line, footer link hover)."
      },
      "ticker-black": {
        "$type": "color",
        "$value": "#000000",
        "role": "Market ticker strip."
      },
      "ticker-text": {
        "$type": "color",
        "$value": "#E9E9EE",
        "role": "Ticker figures."
      },
      "ticker-up": {
        "$type": "color",
        "$value": "#4BE08F",
        "role": "Gains on the ticker."
      },
      "ticker-down": {
        "$type": "color",
        "$value": "#FF7A6E",
        "role": "Losses on the ticker."
      },
      "chip-border": {
        "$type": "color",
        "$value": "#3A3A46",
        "role": "Theme toggle and volume chip outline on void."
      },
      "nav-separator": {
        "$type": "color",
        "$value": "#55556A",
        "role": "The \"/\" between section nav links."
      },
      "void-text": {
        "$type": "color",
        "$value": "#C9C9D3",
        "role": "Secondary text on void."
      },
      "heatmap-up": {
        "$type": "color",
        "$value": "#0FA05A",
        "role": "Market heatmap gains."
      },
      "heatmap-down": {
        "$type": "color",
        "$value": "#E0322A",
        "role": "Market heatmap losses."
      }
    },
    "chart": {
      "line": [
        "var(--ink)",
        "var(--accent)",
        "var(--teal)",
        "var(--gold)",
        "#3F6FB0",
        "#7a3fa0",
        "#c0457a",
        "#8a5a44",
        "#6b7280",
        "#2f7d5b"
      ],
      "stack": [
        "#1f2a44",
        "#A23B2A",
        "#3c6e47",
        "#b5832a",
        "#5b4a7a",
        "#2f6f7e",
        "#8a5a44",
        "#6b7280",
        "#9c2f5d",
        "#4b6b2f",
        "#c06c2c"
      ],
      "factFaces": [
        "#C8106A",
        "#5A22D8",
        "#0B0B0F",
        "#1D3F8F"
      ]
    }
  },
  "font": {
    "sans": {
      "$type": "fontFamily",
      "$value": [
        "Geist",
        "system-ui",
        "-apple-system",
        "Segoe UI",
        "Arial",
        "sans-serif"
      ],
      "weights": [
        400,
        500,
        600,
        700,
        750,
        800,
        850,
        900
      ]
    },
    "mono": {
      "$type": "fontFamily",
      "$value": [
        "Geist Mono",
        "ui-monospace",
        "SFMono-Regular",
        "Menlo",
        "Consolas",
        "monospace"
      ],
      "weights": [
        500,
        700
      ]
    },
    "serif": {
      "$type": "fontFamily",
      "$value": [
        "Newsreader",
        "Georgia",
        "Times New Roman",
        "serif"
      ],
      "weights": [
        400,
        600
      ],
      "italic": [
        400
      ]
    },
    "googleFonts": "https://fonts.googleapis.com/css2?family=Geist:wght@400..900&family=Geist+Mono:wght@500;700&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,600;1,6..72,400&display=swap"
  },
  "typeScale": {
    "Nameplate": {
      "spec": "Geist 900 · clamp(46px, 10.1vw, 164px) / .84 · -0.065em",
      "css": "font:900 clamp(40px,7vw,96px)/.84 var(--sans);letter-spacing:-.065em"
    },
    "Divider title": {
      "spec": "Geist 900 · clamp(34px, 5vw, 72px) / .95 · -0.055em",
      "css": "font:900 clamp(34px,5vw,72px)/.95 var(--sans);letter-spacing:-.055em"
    },
    "CPG title": {
      "spec": "Geist 900 · clamp(30px, 4vw, 60px) / .95 · -0.05em",
      "css": "font:900 clamp(30px,4vw,60px)/.95 var(--sans);letter-spacing:-.05em"
    },
    "Lead headline": {
      "spec": "Geist 850 · clamp(32px, 3.5vw, 58px) / .98 · -0.045em",
      "css": "font:850 clamp(32px,3.5vw,58px)/.98 var(--sans);letter-spacing:-.045em"
    },
    "Brief number": {
      "spec": "Geist 900 · 44px / 1 · -0.06em · Hot Pink",
      "css": "font:900 44px/1 var(--sans);letter-spacing:-.06em;color:var(--pink)"
    },
    "Stat": {
      "spec": "Geist 850 · 32px / 1 · -0.04em · tabular",
      "css": "font:850 32px/1 var(--sans);letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--accent)"
    },
    "Desk top headline": {
      "spec": "Geist 850 · clamp(21px, 1.75vw, 27px) / 1.06 · -0.035em",
      "css": "font:850 clamp(21px,1.75vw,27px)/1.06 var(--sans);letter-spacing:-.035em"
    },
    "Section label": {
      "spec": "Geist 800 · 22px / 1.15 · -0.02em · 4px ink rule",
      "css": "font:800 22px/1.15 var(--sans);letter-spacing:-.02em"
    },
    "Headline": {
      "spec": "Geist 750 · 21px / 1.15 · -0.02em · balance",
      "css": "font:750 21px/1.15 var(--sans);letter-spacing:-.02em"
    },
    "Deck": {
      "spec": "Newsreader italic 400 · 21px / 1.35",
      "css": "font:italic 400 21px/1.35 var(--serif);color:var(--ink2)"
    },
    "Lead body": {
      "spec": "Newsreader 400 · 18.5px / 1.6",
      "css": "font:400 18.5px/1.6 var(--serif)"
    },
    "Body": {
      "spec": "Newsreader 400 · 17px / 1.55 (body default)",
      "css": "font:400 17px/1.55 var(--serif)"
    },
    "Summary": {
      "spec": "Newsreader 400 · 16.5px / 1.55 · Ink 2",
      "css": "font:400 16.5px/1.55 var(--serif);color:var(--ink2)"
    },
    "Nav link": {
      "spec": "Geist 600 · 14px / 1",
      "css": "font:600 14px/1 var(--sans)"
    },
    "Kicker": {
      "spec": "Geist Mono 700 · 11px / 1.2 · +0.1em · uppercase · Accent",
      "css": "font:700 11px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent)"
    },
    "Meta": {
      "spec": "Geist Mono 500 · 11.5px / 1.4 · +0.02em · Muted",
      "css": "font:500 11.5px/1.4 var(--mono);letter-spacing:.02em;color:var(--muted)"
    }
  },
  "size": {
    "maxWidth": "1320px",
    "maxWidthWide": "1480px (from 1600px)",
    "pad": "clamp(14px, 2.6vw, 36px)",
    "radius": "4px",
    "radiusSm": "2px",
    "radiusLg": "6px",
    "pill": "999px",
    "navHeight": "52px",
    "minTarget": "44px"
  },
  "shadow": {
    "hard": "4px 4px 0 var(--ink)",
    "hardDark": "4px 4px 0 var(--pink)",
    "pop": "6px 6px 0 var(--pink)",
    "hair": "0 1px 0 var(--hair)"
  },
  "motion": {
    "ease": "cubic-bezier(.2, .7, .2, 1)",
    "fast": ".2s",
    "ui": ".25s to .35s",
    "reveal": ".5s to .7s",
    "chart": ".9s to 1.4s",
    "countUp": "900ms",
    "ticker": "90s linear"
  },
  "breakpoints": {
    "phone": "max-width: 640px",
    "tablet": "641px to 900px",
    "small": "901px to 1100px",
    "desktop": "min-width: 1101px",
    "wide": "min-width: 1300px",
    "xwide": "min-width: 1600px"
  }
}
