Rabobank color palette
FinanceRabobank's color identity is defined by its distinctive deep blue and vibrant orange, reflecting trust and Dutch heritage. The palette is complemented by neutral grays and white for clarity and accessibility.
rabobank.comRabobank colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Rabobank BluePrimary0, 48, 135
- Rabobank OrangeSecondary255, 105, 0
- Rabobank YellowAccent255, 209, 0
Surfaces
Page, cards and dividers.- Rabobank WhiteBackground255, 255, 255
- Rabobank Light GraySurface245, 246, 247
- Rabobank Border GrayBorder209, 213, 219
Text
Three tiers of copy.- Rabobank BlackText26, 26, 26
- Rabobank Dark GraySecondary text75, 75, 75
- Rabobank Muted GrayMuted text110, 110, 110
Semantic
Feedback and state colors.- Rabobank GreenSuccess60, 179, 113
- Rabobank Warning OrangeWarning255, 179, 0
- Rabobank RedError229, 57, 53
- Rabobank Info BlueInfo25, 118, 210
Use Rabobank's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
rabobank-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1976D2;
--error: #E53935;
--accent: #FFD100;
--border: #D1D5DB;
--primary: #003087;
--success: #3CB371;
--surface: #F5F6F7;
--warning: #FFB300;
--secondary: #FF6900;
--text-muted: #6E6E6E;
--background: #FFFFFF;
--text-primary: #1A1A1A;
--text-secondary: #4B4B4B;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
17.4:1
Pass
Text on surface
Needs 4.5:1 for body text
16.1:1
Pass
Secondary text on background
Needs 4.5:1 for body text
8.7:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
8.1:1
Pass
Muted text on background
Needs 3:1 for large text
5.1:1
Pass
Muted text on surface
Needs 3:1 for large text
4.7:1
Pass
Rabobank gray and neutral colors
The quiet part of the Rabobank palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Rabobank WhiteBackground
- HEX
- RGB
- HSL
- Rabobank Light GraySurface
- HEX
- RGB
- HSL
- Rabobank Border GrayBorder
- HEX
- RGB
- HSL
- Rabobank BlackText
- HEX
- RGB
- HSL
- Rabobank Dark GraySecondary text
- HEX
- RGB
- HSL
- Rabobank Muted GrayMuted text
- HEX
- RGB
- HSL
About Rabobank's colors
Rabobank's palette is built around a strong blue and orange contrast, representing reliability and energy. The supporting neutrals ensure accessibility and a modern, clean interface.
Primary blue and orange are complementary and create strong visual hierarchy.
Yellow accent is used sparingly for highlights and calls to action.
Neutrals balance the vivid brand colors for readability and clarity.
Psychology
Blue conveys trust, stability, and professionalism, essential for a financial institution. Orange adds warmth and approachability, reflecting Rabobank's Dutch roots.
Evolution
Rabobank's color palette has remained largely consistent, with blue and orange as core elements since its inception. Minor adjustments have been made to neutral tones for digital accessibility.
Where Rabobank uses each color
- Primary
Rabobank Blue is used for headers, navigation bars, and primary buttons.
- Secondary
Rabobank Orange appears in call-to-action buttons, highlights, and key visual elements.
- Accent
Rabobank Yellow is reserved for subtle highlights and notification badges.
- Backgrounds
Rabobank White and Light Gray are used for page backgrounds and content surfaces.
- Text
Rabobank Black and Dark Gray are used for primary and secondary text, ensuring readability.
- Semantic
Green, Orange, Red, and Info Blue are used for status indicators, alerts, and feedback messages.
Rabobank color questions
Hex codes, RGB values, neutrals and how to use the palette.
The primary Rabobank brand color is Rabobank Blue, hex code #003087.
Rabobank Blue (#003087) in RGB is 0, 48, 135; in CMYK it is 100, 64, 0, 47.
Rabobank uses Light Gray (#F5F6F7), Border Gray (#D1D5DB), and Black (#1A1A1A) for backgrounds, borders, and text.
Primary and secondary colors should dominate navigation and key actions, while neutrals support content and accessibility. Accent and semantic colors are reserved for highlights, alerts, and feedback.
The secondary color is Rabobank Orange, #FF6900, and the accent is Rabobank Yellow, #FFD100. Together with the primary they make up the three brand colors at the top of this page.
6 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 Rabobank's colors consistently when it generates UI.
Make something in the spirit of Rabobank
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.