<!-- SPDX-License-Identifier: MIT -->
<!-- SPDX-FileCopyrightText: 2025-2026 Marcus Quinn -->

# Uber Design: Color Palette & Roles

## Primary

- **Uber Black** (`#000000`): The defining brand color — used for primary buttons, headlines, navigation text, and the footer. Not "near-black" or "off-black," but true, uncompromising black.
- **Pure White** (`#ffffff`): The primary surface color and inverse text. Used for page backgrounds, card surfaces, and text on black elements.

## Interactive & Button States

- **Hover Gray** (`#e2e2e2`): White button hover state — a clean, cool light gray that provides clear feedback without warmth.
- **Hover Light** (`#f3f3f3`): Subtle hover for elevated white buttons — barely-there gray for gentle interaction feedback.
- **Chip Gray** (`#efefef`): Background for secondary/filter buttons and navigation chips — a neutral, ultra-light gray.

## Text & Content

- **Body Gray** (`#4b4b4b`): Secondary text and footer links — a true mid-gray with no warm or cool bias.
- **Muted Gray** (`#afafaf`): Tertiary text, de-emphasized footer links, and placeholder content.

## Borders & Separation

- **Border Black** (`#000000`): Thin 1px borders for structural containment — used sparingly on dividers and form containers.

## Shadows & Depth

- **Shadow Light** (`rgba(0, 0, 0, 0.12)`): Standard card elevation — a featherweight lift for content cards.
- **Shadow Medium** (`rgba(0, 0, 0, 0.16)`): Slightly stronger elevation for floating action buttons and overlays.
- **Button Press** (`rgba(0, 0, 0, 0.08)`): Inset shadow for active/pressed states on secondary buttons.

## Link States

- **Default Link Blue** (`#0000ee`): Standard browser blue for text links with underline — used in body content.
- **Link White** (`#ffffff`): Links on dark surfaces — used in footer and dark sections.
- **Link Black** (`#000000`): Links on light surfaces with underline decoration.

## Gradient System

Uber's design is **entirely gradient-free**. The black/white duality and flat color blocks create all visual hierarchy. No gradients appear anywhere in the system — every surface is a solid color, every transition is a hard edge or a shadow.
