UBS color palette
FinanceUBS uses a restrained, classic color palette centered on its signature red, complemented by white and a range of neutral grays. This color system reflects the brand's heritage, stability, and clarity in the financial sector.
ubs.comUBS colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- UBS RedPrimary224, 0, 27
- UBS BlackSecondary0, 0, 0
- UBS Light GrayAccent179, 179, 179
Surfaces
Page, cards and dividers.- UBS WhiteBackground255, 255, 255
- UBS Paper GraySurface245, 245, 245
- UBS Border GrayBorder217, 217, 214
Text
Three tiers of copy.- UBS Text BlackText0, 0, 0
- UBS Text GraySecondary text102, 102, 102
- UBS Muted GrayMuted text166, 166, 166
Semantic
Feedback and state colors.- UBS Success GreenSuccess0, 122, 51
- UBS Warning YellowWarning255, 182, 0
- UBS Error RedError224, 0, 27
- UBS Info BlueInfo0, 114, 206
Use UBS's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
ubs-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #E0001B;
--accent: #B3B3B3;
--border: #D9D9D6;
--primary: #E0001B;
--success: #007A33;
--surface: #F5F5F5;
--warning: #FFB600;
--secondary: #000000;
--text-muted: #A6A6A6;
--background: #FFFFFF;
--text-primary: #000000;
--text-secondary: #666666;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
21.0:1
Pass
Text on surface
Needs 4.5:1 for body text
19.3:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.7:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.3:1
Pass
Muted text on background
Needs 3:1 for large text
2.4:1
Fail
Muted text on surface
Needs 3:1 for large text
2.2:1
Fail
UBS gray and neutral colors
The quiet part of the UBS palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- UBS WhiteBackground
- HEX
- RGB
- HSL
- UBS Paper GraySurface
- HEX
- RGB
- HSL
- UBS Border GrayBorder
- HEX
- RGB
- HSL
- UBS Text BlackText
- HEX
- RGB
- HSL
- UBS Text GraySecondary text
- HEX
- RGB
- HSL
- UBS Muted GrayMuted text
- HEX
- RGB
- HSL
About UBS's colors
UBS's color palette is minimalistic, relying on a powerful red for brand recognition and a range of neutrals for clarity and professionalism. The restrained use of color supports a sense of trust and stability.
Red contrasts with white for high visibility.
Grays provide neutral backgrounds and structure.
Accent colors are used sparingly for functional UI states.
Psychology
Red communicates energy, leadership, and confidence, while the extensive use of white and gray conveys transparency and reliability. The palette is designed to evoke trust and a sense of tradition.
Evolution
UBS's color palette has remained largely unchanged for decades, reinforcing its brand consistency. Minor adjustments to gray tones have been made for digital accessibility.
Where UBS uses each color
- Primary
UBS Red is used for the logo, key buttons, and important highlights.
- Secondary
UBS Black is used for text, navigation, and key UI elements.
- Accent
UBS Light Gray appears in backgrounds, dividers, and secondary UI components.
- Backgrounds
UBS White and Paper Gray are used for main backgrounds and content areas.
- Text
Text Black is standard for primary text, with Text Gray and Muted Gray for secondary and disabled text.
- Semantic
Success Green, Warning Yellow, Error Red, and Info Blue are used for alerts, notifications, and status indicators.
UBS color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official UBS brand color is UBS Red, with hex code #E0001B.
UBS Red is #E0001B, which is RGB(224, 0, 27) and CMYK(0, 100, 88, 12).
UBS uses several grays, including UBS Light Gray (#B3B3B3), Paper Gray (#F5F5F5), and Border Gray (#D9D9D6), to provide structure and clarity in digital interfaces.
Use UBS Red (#E0001B) sparingly for emphasis, with white and grays dominating backgrounds and surfaces. Semantic colors like Success Green (#007A33) and Info Blue (#0072CE) are reserved for status and alerts.
The secondary color is UBS Black, #000000, and the accent is UBS Light Gray, #B3B3B3. 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 UBS's colors consistently when it generates UI.
Make something in the spirit of UBS
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.