{
  "id": "booking",
  "version": "1.0.0",
  "name": "Booking.com",
  "description": "Booking.com is a global online travel agency — accommodations, flights, car rentals, attractions — founded in Amsterdam in 1996 and acquired by Priceline (now Booking Holdings) in 2005. The brand identity is utilitarian rather than expressive: the deep Booking Blue (#003580) wordmark and chrome carry the brand against dense, information-rich product surfaces. A secondary Booking Yellow is used historically for the \"Genius\" loyalty program and high-priority CTAs. The voice is direct, transactional, and trust-oriented; the brand chrome stays out of the way of the inventory.\n",
  "provenance": {
    "source": "https://raw.githubusercontent.com/simple-icons/simple-icons/13.0.0/_data/simple-icons.json",
    "license": "Proprietary — All Rights Reserved",
    "attribution": "Booking.com B.V. — Booking.com, the Booking.com wordmark, and the Genius program marks are trademarks of Booking.com B.V. The signature navy (#003580) is verified via the simple-icons brand database (v13.0.0). Booking.com does not maintain a widely visible public design-system page; the homepage is the primary reference for product chrome.\n",
    "importedDate": "2026-05-19",
    "notes": "Booking.com does not publish a public brand-guidelines or design-system surface that exposes its full token table. This atom captures the verified primary brand navy and authors a faithful set of supporting neutrals and functional swatches consistent with the booking.com product chrome; see the palette atom notes. Booking's product typography is a system sans on most surfaces — this atom references Inter@1 as the open-source rendering substitute.\n"
  },
  "tags": [
    "booking",
    "travel",
    "hospitality",
    "ota",
    "brand",
    "navy",
    "blue",
    "light-first"
  ],
  "palette": {
    "ref": "booking@1.0.0",
    "swatches": [
      {
        "id": "booking-blue",
        "name": "Booking Blue",
        "value": "#003580",
        "description": "Booking.com's signature navy — the wordmark, the nav, and primary chrome.",
        "aliases": []
      },
      {
        "id": "booking-blue-deep",
        "name": "Booking Blue Deep",
        "value": "#002A66",
        "description": "Pressed / hover variant of Booking Blue for interactive states.",
        "aliases": []
      },
      {
        "id": "booking-blue-bright",
        "name": "Booking Blue Bright",
        "value": "#0071C2",
        "description": "Brighter mid-blue used historically for links and secondary CTAs on booking.com.",
        "aliases": []
      },
      {
        "id": "booking-yellow",
        "name": "Booking Yellow",
        "value": "#FEBB02",
        "description": "Secondary brand yellow — historically the Genius and high-priority CTA accent on booking.com.",
        "aliases": []
      },
      {
        "id": "booking-ink",
        "name": "Booking Ink",
        "value": "#1A1A1A",
        "description": "Primary text color on light surfaces.",
        "aliases": []
      },
      {
        "id": "booking-charcoal",
        "name": "Booking Charcoal",
        "value": "#333333",
        "description": "Secondary text on light; elevated dark surface.",
        "aliases": []
      },
      {
        "id": "booking-graphite",
        "name": "Booking Graphite",
        "value": "#6B6B6B",
        "description": "Tertiary text and icon color.",
        "aliases": []
      },
      {
        "id": "booking-mist",
        "name": "Booking Mist",
        "value": "#E6E6E6",
        "description": "Border and quiet divider on light canvas.",
        "aliases": []
      },
      {
        "id": "booking-fog",
        "name": "Booking Fog",
        "value": "#F5F5F5",
        "description": "Subtle elevated surface on white.",
        "aliases": []
      },
      {
        "id": "booking-white",
        "name": "Booking White",
        "value": "#FFFFFF",
        "description": "Primary canvas — booking.com is a white-canvas product surface.",
        "aliases": []
      },
      {
        "id": "booking-success",
        "name": "Booking Success",
        "value": "#008009",
        "description": "Functional success — confirmed reservation, completion.",
        "aliases": []
      },
      {
        "id": "booking-error",
        "name": "Booking Error",
        "value": "#C0392B",
        "description": "Functional error — destructive / unavailable states.",
        "aliases": []
      }
    ],
    "modes": {
      "light": {
        "roles": {
          "background": "booking-white",
          "surface": "booking-fog",
          "surface-elevated": "booking-white",
          "text-primary": "booking-ink",
          "text-secondary": "booking-charcoal",
          "text-tertiary": "booking-graphite",
          "primary": "booking-blue",
          "primary-hover": "booking-blue-deep",
          "accent": "booking-yellow",
          "accent-hover": "booking-yellow",
          "success": "booking-success",
          "warning": "booking-yellow",
          "error": "booking-error",
          "border": "booking-mist"
        }
      },
      "dark": {
        "roles": {
          "background": "booking-ink",
          "surface": "booking-charcoal",
          "surface-elevated": "booking-graphite",
          "text-primary": "booking-white",
          "text-secondary": "booking-mist",
          "text-tertiary": "booking-graphite",
          "primary": "booking-blue-bright",
          "primary-hover": "booking-blue",
          "accent": "booking-yellow",
          "accent-hover": "booking-yellow",
          "success": "booking-success",
          "warning": "booking-yellow",
          "error": "booking-error",
          "border": "booking-charcoal"
        }
      }
    }
  },
  "fonts": [
    {
      "role": "heading",
      "ref": "inter@1.0.0",
      "family": "Inter",
      "classification": "sans-serif",
      "source": {
        "kind": "google-fonts",
        "family": "Inter",
        "url": "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
      },
      "fallbackStack": [
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Helvetica Neue",
        "Arial",
        "sans-serif"
      ],
      "availableStyles": [
        {
          "weight": 100,
          "style": "normal"
        },
        {
          "weight": 100,
          "style": "italic"
        },
        {
          "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"
        },
        {
          "weight": 800,
          "style": "normal"
        },
        {
          "weight": 800,
          "style": "italic"
        },
        {
          "weight": 900,
          "style": "normal"
        },
        {
          "weight": 900,
          "style": "italic"
        }
      ]
    },
    {
      "role": "body",
      "ref": "inter@1.0.0",
      "family": "Inter",
      "classification": "sans-serif",
      "source": {
        "kind": "google-fonts",
        "family": "Inter",
        "url": "https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
      },
      "fallbackStack": [
        "-apple-system",
        "BlinkMacSystemFont",
        "Segoe UI",
        "Roboto",
        "Helvetica Neue",
        "Arial",
        "sans-serif"
      ],
      "availableStyles": [
        {
          "weight": 100,
          "style": "normal"
        },
        {
          "weight": 100,
          "style": "italic"
        },
        {
          "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"
        },
        {
          "weight": 800,
          "style": "normal"
        },
        {
          "weight": 800,
          "style": "italic"
        },
        {
          "weight": 900,
          "style": "normal"
        },
        {
          "weight": 900,
          "style": "italic"
        }
      ]
    },
    {
      "role": "mono",
      "ref": "jetbrainsmono-nerdfont@1.0.0",
      "family": "JetBrainsMono Nerd Font",
      "classification": "monospace",
      "source": {
        "kind": "external",
        "family": "JetBrainsMono Nerd Font",
        "notes": "Nerd-Font-patched build of JetBrains Mono. 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": [
        "JetBrains Mono",
        "Fira Code",
        "Menlo",
        "Monaco",
        "Consolas",
        "Liberation Mono",
        "monospace"
      ],
      "availableStyles": [
        {
          "weight": 100,
          "style": "normal"
        },
        {
          "weight": 100,
          "style": "italic"
        },
        {
          "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"
        },
        {
          "weight": 800,
          "style": "normal"
        },
        {
          "weight": 800,
          "style": "italic"
        }
      ]
    }
  ],
  "roles": {
    "colors": {
      "identity": "booking-blue",
      "on-identity": "booking-white",
      "primary": "booking-blue",
      "primary-hover": "booking-blue-deep",
      "accent": "booking-yellow",
      "accent-hover": "booking-yellow",
      "mark": "booking-blue",
      "success": "booking-success",
      "warning": "booking-yellow",
      "error": "booking-error",
      "background-light": "booking-white",
      "background-dark": "booking-ink",
      "surface-light": "booking-fog",
      "surface-dark": "booking-charcoal",
      "text-primary-light": "booking-ink",
      "text-primary-dark": "booking-white",
      "text-secondary-light": "booking-charcoal",
      "text-tertiary-light": "booking-graphite",
      "border-light": "booking-mist"
    },
    "typography": {
      "display": "heading",
      "prose": "body",
      "code": "mono"
    }
  },
  "assets": [],
  "rules": [
    {
      "type": "colorChoice",
      "target": "logo.wordmark.fill",
      "severity": "error",
      "rationale": "The Booking.com wordmark renders in Booking Blue on light surfaces or in white on dark surfaces. The brighter mid-blue and the deep blue are interactive-state and link variants on product surfaces — they are NOT wordmark fills. The secondary yellow is a CTA / Genius hue and never substitutes for the brand navy in the mark.\n",
      "allowed": [
        "booking-blue",
        "booking-white"
      ],
      "forbidden": [
        "booking-blue-bright",
        "booking-blue-deep",
        "booking-yellow",
        "booking-error"
      ]
    },
    {
      "type": "forbiddenTreatment",
      "target": "logo",
      "severity": "error",
      "rationale": "Booking.com's wordmark is rendered flat in the signature navy with generous clearspace. Gradients, shadows, and recolorings compromise the deliberate, trust-anchoring monochrome wordmark, which is the brand's primary recognition asset across a dense, transactional product surface.\n",
      "treatments": [
        "stretched",
        "rotated",
        "recolored",
        "drop-shadow",
        "gradient-fill",
        "on-busy-photo",
        "placed-without-clearspace"
      ]
    },
    {
      "type": "contrastRatio",
      "target": "text-primary",
      "severity": "error",
      "rationale": "Booking Ink (#1A1A1A) on Booking White (#FFFFFF) gives ~17:1 — well above the WCAG AA 4.5:1 floor for body text. The rule encodes the floor for any new foreground/background pairing on booking.com surfaces, where body text density is already high and contrast headroom matters.\n",
      "against": "background",
      "minRatio": 4.5,
      "standard": "WCAG-AA"
    },
    {
      "type": "contrastRatio",
      "target": "roles.colors.primary",
      "severity": "error",
      "rationale": "Booking Blue (#003580) on Booking White (#FFFFFF) gives ~12:1 — well above the WCAG AA 4.5:1 floor. Because Booking Blue carries the wordmark AND functions as the primary link/CTA color in dense product copy, it must clear the full body-text AA contrast (not just the AA-large floor).\n",
      "against": "background",
      "minRatio": 4.5,
      "standard": "WCAG-AA"
    },
    {
      "type": "contextRestriction",
      "target": "roles.colors.accent",
      "severity": "error",
      "rationale": "Booking Yellow is reserved for high-priority CTAs, the Genius loyalty program, and promotional moments. Using it inside body copy, as a subtle divider, or as a stand-in for error states conflicts with its established promotional / loyalty meaning on booking.com surfaces.\n",
      "allowedContexts": [
        "call-to-action",
        "loyalty-program",
        "high-priority-promotion"
      ],
      "forbiddenContexts": [
        "body-text",
        "subtle-divider",
        "error-state"
      ]
    },
    {
      "type": "enumMembership",
      "target": "typography.heading.fontWeight",
      "severity": "warning",
      "rationale": "Booking.com's product typography on the live site uses Regular (400), Medium (500), and Bold (700) cuts of its system sans for headlines and surfaces. Lighter and heavier extremes are not part of the standard product chrome.\n",
      "allowed": [
        "400",
        "500",
        "700"
      ]
    },
    {
      "type": "accessibilityRequirement",
      "target": "*",
      "severity": "error",
      "rationale": "WCAG 2.1 Success Criterion 1.4.3 (Contrast Minimum) — Level AA. Booking.com is a transactional, information-dense product used globally on every device class; AA is the non-negotiable floor for any text on any Booking surface.\n",
      "standard": "WCAG-AA",
      "criterion": "1.4.3"
    },
    {
      "type": "compositionConstraint",
      "target": "roles.colors.primary",
      "severity": "recommendation",
      "rationale": "Booking Blue reads cleanest against white, the lightest fog neutral, or the brand yellow CTA. Pairing it adjacent to the functional error red or success green introduces a chromatic conflict and confuses the brand-navy with a status signal.\n",
      "pairsWith": [
        "booking-white",
        "booking-fog",
        "booking-yellow"
      ],
      "doesNotPairWith": [
        "booking-error",
        "booking-success"
      ]
    }
  ]
}