{
  "id": "outlook",
  "version": "1.0.0",
  "name": "Outlook",
  "description": "Outlook is Microsoft's email-and-calendar product — the consumer side of Microsoft 365 personal mail and a flagship enterprise productivity surface. Outlook is a product-brand under the Microsoft parent (see brands/microsoft/1.0.0); it inherits the Fluent design language, the Segoe UI typographic family, and Microsoft's enterprise-clear voice. The visual fingerprint that distinguishes Outlook specifically is the envelope-with-O mark — a deep-navy envelope outer, a pale-blue inner flap, and the white \"O\" ring — and the Communications Blue primary (#0078D4 / #0067B8) used for the Compose button and primary links across the product surface.\n",
  "provenance": {
    "source": "https://www.microsoft.com/design/fluent/",
    "license": "Proprietary — All Rights Reserved",
    "attribution": "Outlook, the Outlook envelope-with-O mark, Microsoft, Fluent, and Segoe UI are trademarks of the Microsoft group of companies. Brand colors and identity guidance documented here are derived from microsoft.com/design/, the Fluent 2 design system at fluent2.microsoft.design, and the live Outlook product surface at outlook.live.com.\n",
    "importedDate": "2026-05-18",
    "notes": "Outlook inherits from the Microsoft Fluent design language; see brands/microsoft/1.0.0. Identity role uses the Outlook envelope mark colors specifically. This atom is brand-atoms' read of public Outlook surfaces; it is not an official Microsoft brand document. The Outlook mark is among the most-protected trademarks on the internet; no asset files are bundled here. Outlook's primary typeface is Segoe UI (referenced via segoe-ui@1).\n"
  },
  "tags": [
    "outlook",
    "microsoft",
    "email",
    "product-brand",
    "fluent",
    "productivity",
    "enterprise"
  ],
  "palette": {
    "ref": "outlook@1.0.0",
    "swatches": [
      {
        "id": "outlook-deep-blue",
        "name": "Outlook Deep Blue",
        "value": "#2A446F",
        "description": "The outer-envelope navy. Captured from the SVG fill on the Outlook logo on outlook.live.com. The dominant identity hue of the Outlook mark.\n",
        "aliases": []
      },
      {
        "id": "outlook-action-blue",
        "name": "Outlook Action Blue",
        "value": "#0066FF",
        "description": "The \"O\" ring on the Outlook envelope and the brand's vibrant mid-blue. Used on the live product surface for the logo letter-mark fill.\n",
        "aliases": []
      },
      {
        "id": "outlook-sky",
        "name": "Outlook Sky",
        "value": "#B3DAF0",
        "description": "The pale-blue envelope flap on the Outlook mark. A light-tint accent that softens the deep-navy outer fill.\n",
        "aliases": []
      },
      {
        "id": "communications-blue",
        "name": "Communications Blue",
        "value": "#0078D4",
        "description": "Microsoft's Fluent system primary, inherited from the Microsoft parent. The canonical CTA / link affordance across Outlook product chrome.\n",
        "aliases": []
      },
      {
        "id": "outlook-link-blue",
        "name": "Outlook Link Blue",
        "value": "#0067B8",
        "description": "The action-text blue captured from outlook.live.com — Fluent's darker brand variant used for links and primary buttons on light surfaces, where #0078D4 would lose AA contrast on small type.\n",
        "aliases": []
      },
      {
        "id": "outlook-ink",
        "name": "Outlook Ink",
        "value": "#17253D",
        "description": "Primary text and heading color, captured from the live product. A deep navy-tinged near-black that pairs with the envelope-deep-blue identity hue.\n",
        "aliases": []
      },
      {
        "id": "outlook-near-black",
        "name": "Outlook Near-Black",
        "value": "#1F1F1F",
        "description": "Fluent's soft near-black for body text on light surfaces.",
        "aliases": []
      },
      {
        "id": "outlook-gray-160",
        "name": "Outlook Gray 160",
        "value": "#605E5C",
        "description": "Secondary text and inactive UI (Fluent Neutral Foreground 2), inherited from the Microsoft parent.\n",
        "aliases": []
      },
      {
        "id": "outlook-gray-30",
        "name": "Outlook Gray 30",
        "value": "#EDEBE9",
        "description": "Subtle surface tint (Fluent Neutral Background 3).",
        "aliases": []
      },
      {
        "id": "outlook-canvas",
        "name": "Outlook Canvas",
        "value": "#FFFDFB",
        "description": "The warm-white inbox canvas captured from outlook.live.com. A barely-off-white surface that reduces eye-strain on long reading sessions.\n",
        "aliases": []
      },
      {
        "id": "outlook-white",
        "name": "Outlook White",
        "value": "#FFFFFF",
        "description": "Base background and reversed text on chromatic surfaces.",
        "aliases": []
      }
    ],
    "modes": {
      "light": {
        "roles": {
          "background": "outlook-canvas",
          "surface": "outlook-gray-30",
          "surface-elevated": "outlook-white",
          "text-primary": "outlook-ink",
          "text-secondary": "outlook-gray-160",
          "primary": "outlook-link-blue",
          "primary-hover": "communications-blue",
          "accent": "outlook-action-blue",
          "accent-hover": "outlook-link-blue",
          "error": "outlook-action-blue",
          "success": "outlook-action-blue",
          "border": "outlook-gray-30"
        }
      },
      "dark": {
        "roles": {
          "background": "outlook-ink",
          "surface": "outlook-deep-blue",
          "surface-elevated": "outlook-gray-160",
          "text-primary": "outlook-white",
          "text-secondary": "outlook-sky",
          "primary": "outlook-sky",
          "primary-hover": "outlook-action-blue",
          "accent": "outlook-action-blue",
          "accent-hover": "outlook-sky",
          "border": "outlook-gray-160"
        }
      }
    }
  },
  "fonts": [
    {
      "role": "heading",
      "ref": "segoe-ui@1.0.0",
      "family": "Segoe UI",
      "classification": "sans-serif",
      "source": {
        "kind": "system",
        "stack": [
          "Segoe UI Variable",
          "Segoe UI",
          "system-ui",
          "-apple-system",
          "BlinkMacSystemFont",
          "Helvetica Neue",
          "Arial",
          "sans-serif"
        ]
      },
      "fallbackStack": [
        "system-ui",
        "Inter",
        "Helvetica Neue",
        "Arial",
        "sans-serif"
      ],
      "availableStyles": [
        {
          "weight": 300,
          "style": "normal"
        },
        {
          "weight": 400,
          "style": "normal"
        },
        {
          "weight": 600,
          "style": "normal"
        },
        {
          "weight": 700,
          "style": "normal"
        }
      ]
    },
    {
      "role": "body",
      "ref": "segoe-ui@1.0.0",
      "family": "Segoe UI",
      "classification": "sans-serif",
      "source": {
        "kind": "system",
        "stack": [
          "Segoe UI Variable",
          "Segoe UI",
          "system-ui",
          "-apple-system",
          "BlinkMacSystemFont",
          "Helvetica Neue",
          "Arial",
          "sans-serif"
        ]
      },
      "fallbackStack": [
        "system-ui",
        "Inter",
        "Helvetica Neue",
        "Arial",
        "sans-serif"
      ],
      "availableStyles": [
        {
          "weight": 300,
          "style": "normal"
        },
        {
          "weight": 400,
          "style": "normal"
        },
        {
          "weight": 600,
          "style": "normal"
        },
        {
          "weight": 700,
          "style": "normal"
        }
      ]
    },
    {
      "role": "mono",
      "ref": "cascadiacode-nerdfont@1.0.0",
      "family": "CaskaydiaCove Nerd Font",
      "classification": "monospace",
      "source": {
        "kind": "external",
        "family": "CaskaydiaCove Nerd Font",
        "notes": "Nerd-Font-patched build of Cascadia Code (renamed CaskaydiaCove for distribution). Not available via Google Fonts. Download woff2/ttf files from the Nerd Fonts GitHub release and self-host, or install system-wide for terminal/IDE use.\n"
      },
      "fallbackStack": [
        "Cascadia Code",
        "JetBrains Mono",
        "Menlo",
        "Monaco",
        "Consolas",
        "Liberation Mono",
        "monospace"
      ],
      "availableStyles": [
        {
          "weight": 200,
          "style": "normal"
        },
        {
          "weight": 200,
          "style": "italic"
        },
        {
          "weight": 300,
          "style": "normal"
        },
        {
          "weight": 300,
          "style": "italic"
        },
        {
          "weight": 400,
          "style": "normal"
        },
        {
          "weight": 400,
          "style": "italic"
        },
        {
          "weight": 500,
          "style": "normal"
        },
        {
          "weight": 500,
          "style": "italic"
        },
        {
          "weight": 600,
          "style": "normal"
        },
        {
          "weight": 600,
          "style": "italic"
        },
        {
          "weight": 700,
          "style": "normal"
        },
        {
          "weight": 700,
          "style": "italic"
        }
      ]
    }
  ],
  "roles": {
    "colors": {
      "identity": "outlook-deep-blue",
      "on-identity": "outlook-white",
      "primary": "outlook-link-blue",
      "primary-hover": "communications-blue",
      "accent": "outlook-action-blue",
      "accent-hover": "outlook-link-blue",
      "mark-envelope-outer": "outlook-deep-blue",
      "mark-envelope-flap": "outlook-sky",
      "mark-letter-o": "outlook-action-blue",
      "background": "outlook-canvas",
      "surface": "outlook-gray-30",
      "text-primary": "outlook-ink",
      "text-secondary": "outlook-gray-160"
    },
    "typography": {
      "display": "heading",
      "prose": "body",
      "code": "mono"
    }
  },
  "assets": [],
  "rules": [
    {
      "type": "colorChoice",
      "target": "logo.envelope-mark",
      "severity": "error",
      "rationale": "The Outlook envelope-with-O mark uses exactly four fills — Deep Blue (#2A446F) outer, Sky (#B3DAF0) flap, Action Blue (#0066FF) on the \"O\" ring, and white negative space. Communications Blue (#0078D4) is the Fluent system primary for product chrome and link affordances, not a logo fill — substituting it muddies the envelope's intentional contrast between deep navy and bright \"O\".\n",
      "allowed": [
        "outlook-deep-blue",
        "outlook-sky",
        "outlook-action-blue",
        "outlook-white"
      ],
      "forbidden": [
        "communications-blue",
        "outlook-ink"
      ]
    },
    {
      "type": "forbiddenTreatment",
      "target": "logo",
      "severity": "error",
      "rationale": "Microsoft's brand guidelines explicitly prohibit altering the proportions, colors, or arrangement of the Outlook envelope mark. The \"O\" and the envelope are a unified mark — separating them, or reverting to the pre-2018 wireframe envelope, breaks brand recognition.\n",
      "treatments": [
        "stretched",
        "rotated",
        "recolored",
        "drop-shadow",
        "on-busy-photo",
        "separated-envelope-and-o",
        "reverted-to-old-blue-envelope"
      ]
    },
    {
      "type": "contrastRatio",
      "target": "text-primary",
      "severity": "error",
      "rationale": "WCAG 2.1 Level AA contrast requirement for body text. Outlook Ink (#17253D) on Outlook Canvas (#FFFDFB) clears AA at ~15:1, matching Fluent's accessibility floor for text-on-background pairings.\n",
      "against": "background",
      "minRatio": 4.5,
      "standard": "WCAG-AA"
    },
    {
      "type": "contrastRatio",
      "target": "roles.colors.primary",
      "severity": "error",
      "rationale": "Outlook Link Blue (#0067B8) on Outlook Canvas clears AA at ~5.3:1 — the live product uses #0067B8 in place of the lighter #0078D4 Communications Blue specifically because #0078D4 on a warm-white canvas drops below 4.5:1 for small body-text links.\n",
      "against": "background",
      "minRatio": 4.5,
      "standard": "WCAG-AA"
    },
    {
      "type": "colorChoice",
      "target": "roles.colors.primary",
      "severity": "error",
      "rationale": "Primary action affordances (Compose, Send, link text) must use one of the two Fluent / Outlook system blues. The brighter Action Blue (#0066FF) is reserved for the envelope-mark \"O\" ring; the deep-navy envelope outer is identity-only and lacks the affordance signal for \"clickable.\"\n",
      "allowed": [
        "outlook-link-blue",
        "communications-blue"
      ],
      "forbidden": [
        "outlook-action-blue",
        "outlook-deep-blue"
      ]
    },
    {
      "type": "compositionConstraint",
      "target": "roles.colors.identity",
      "severity": "recommendation",
      "rationale": "The deep-navy envelope reads cleanest against white or against its own pale-blue flap. Pairing the navy outer with the bright Action Blue \"O\" at large scale (without the envelope context) reads as two competing blues fighting for hierarchy.\n",
      "pairsWith": [
        "outlook-white",
        "outlook-canvas",
        "outlook-sky"
      ],
      "doesNotPairWith": [
        "outlook-action-blue"
      ]
    },
    {
      "type": "fontPairing",
      "target": "typography.heading",
      "severity": "recommendation",
      "rationale": "Outlook inherits Fluent's Segoe UI for both heading and body. A 1.4× minimum size ratio preserves hierarchy when one family does double duty — Fluent's type ramp runs from Caption (~12px) to Title (~32px+), and Outlook's product chrome uses the same scale.\n",
      "requires": "body",
      "minSizeRatio": 1.4
    },
    {
      "type": "enumMembership",
      "target": "typography.body.fontWeight",
      "severity": "recommendation",
      "rationale": "Outlook inherits Fluent's type-weight discipline — Segoe UI Regular (400) and Semibold (600) for the majority of UI surfaces. Lighter and heavier weights are reserved for specific roles (Light for hero display, Bold for emphasis).\n",
      "allowed": [
        "400",
        "600"
      ]
    }
  ]
}