Uber color palette
AutomotiveUber's color identity is defined by a minimalist, high-contrast palette centered on black, white, and grayscale neutrals. The brand uses these tones to convey clarity, reliability, and modernity across its digital and physical assets.
uber.comUber colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Uber BlackPrimary0, 0, 0
- Uber WhiteSecondary255, 255, 255
- Uber BlueAccent39, 110, 241
Surfaces
Page, cards and dividers.- Uber Light GrayBackground246, 246, 246
- Uber Surface GraySurface226, 226, 226
- Uber Border GrayBorder214, 214, 214
Text
Three tiers of copy.- Uber Text BlackText0, 0, 0
- Uber Text GraySecondary text84, 84, 84
- Uber Muted GrayMuted text155, 155, 155
Semantic
Feedback and state colors.- Uber Success GreenSuccess46, 204, 64
- Uber Warning YellowWarning255, 192, 67
- Uber Error RedError225, 25, 0
- Uber Info BlueInfo39, 110, 241
Use Uber's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
uber-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #276EF1;
--error: #E11900;
--accent: #276EF1;
--border: #D6D6D6;
--primary: #000000;
--success: #2ECC40;
--surface: #E2E2E2;
--warning: #FFC043;
--secondary: #FFFFFF;
--text-muted: #9B9B9B;
--background: #F6F6F6;
--text-primary: #000000;
--text-secondary: #545454;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
19.4:1
Pass
Text on surface
Needs 4.5:1 for body text
16.2:1
Pass
Secondary text on background
Needs 4.5:1 for body text
7.0:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.8:1
Pass
Muted text on background
Needs 3:1 for large text
2.6:1
Fail
Muted text on surface
Needs 3:1 for large text
2.1:1
Fail
Uber gray and neutral colors
The quiet part of the Uber palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Uber Light GrayBackground
- HEX
- RGB
- HSL
- Uber Surface GraySurface
- HEX
- RGB
- HSL
- Uber Border GrayBorder
- HEX
- RGB
- HSL
- Uber Text BlackText
- HEX
- RGB
- HSL
- Uber Text GraySecondary text
- HEX
- RGB
- HSL
- Uber Muted GrayMuted text
- HEX
- RGB
- HSL
About Uber's colors
Uber's palette is built on strong black and white contrasts, supported by a range of neutral grays and a single blue accent. This approach emphasizes clarity, accessibility, and a modern digital-first identity.
Primary black contrasts with white for maximum legibility.
Grays provide depth and hierarchy in UI elements.
Blue is reserved for key actions and highlights.
Psychology
Black conveys authority, sophistication, and reliability, while white and grays provide a sense of openness and simplicity. The blue accent introduces a touch of approachability and trust.
Evolution
Uber's palette shifted in 2018 from a more colorful, pattern-driven system to a stark, monochromatic scheme with minimal accent use. The current palette has remained consistent, reinforcing the brand's focus on clarity and universality.
Where Uber uses each color
- Primary
Uber Black is used for the logo, primary navigation, and key headings.
- Secondary
Uber White is used for backgrounds and negative space throughout the app and website.
- Accent
Uber Blue highlights interactive elements such as links, buttons, and selected states.
- Backgrounds
Uber Light Gray is used for app backgrounds and dashboard panels.
- Text
Uber Text Black and Uber Text Gray are used for primary and secondary text, respectively, ensuring strong readability.
- Semantic
Uber Success Green, Warning Yellow, and Error Red are used for status indicators, alerts, and feedback messages.
Uber color questions
Hex codes, RGB values, neutrals and how to use the palette.
Uber's official primary color is #000000, known as Uber Black. This is used for the logo and primary navigation.
Uber Black (#000000) in RGB is (0, 0, 0) and in CMYK is (0, 0, 0, 100).
Uber uses a range of grays including Uber Light Gray (#F6F6F6), Uber Surface Gray (#E2E2E2), Uber Border Gray (#D6D6D6), Uber Text Gray (#545454), and Uber Muted Gray (#9B9B9B). These are used for backgrounds, borders, and secondary text.
Use Uber Black (#000000) for primary elements and text, Uber White (#FFFFFF) for backgrounds, and Uber Blue (#276EF1) sparingly for interactive accents. Grays provide structure and hierarchy in UI layouts.
The secondary color is Uber White, #FFFFFF, and the accent is Uber Blue, #276EF1. Together with the primary they make up the three brand colors at the top of this page.
4 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies Uber's colors consistently when it generates UI.
Make something in the spirit of Uber
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.