Carrefour color palette
Food & DrinkCarrefour's color identity is defined by a strong blue primary, complemented by red, white, and neutral grays, reflecting its French heritage and clarity in retail environments. The palette is consistent across digital and physical touchpoints.
carrefour.comCarrefour colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Carrefour BluePrimary0, 78, 159
- Carrefour RedSecondary227, 6, 19
- Carrefour WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- Carrefour Light GrayBackground245, 245, 245
- Carrefour Surface GraySurface230, 231, 232
- Carrefour Border GrayBorder191, 193, 195
Text
Three tiers of copy.- Carrefour CharcoalText34, 34, 34
- Carrefour Medium GraySecondary text102, 102, 102
- Carrefour Muted GrayMuted text167, 169, 172
Semantic
Feedback and state colors.- Carrefour GreenSuccess67, 176, 42
- Carrefour YellowWarning255, 184, 28
- Carrefour RedError227, 6, 19
- Carrefour CyanInfo0, 159, 227
Use Carrefour's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
carrefour-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #009FE3;
--error: #E30613;
--accent: #FFFFFF;
--border: #BFC1C3;
--primary: #004E9F;
--success: #43B02A;
--surface: #E6E7E8;
--warning: #FFB81C;
--secondary: #E30613;
--text-muted: #A7A9AC;
--background: #F5F5F5;
--text-primary: #222222;
--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
14.6:1
Pass
Text on surface
Needs 4.5:1 for body text
12.8:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.3:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.6:1
Pass
Muted text on background
Needs 3:1 for large text
2.2:1
Fail
Muted text on surface
Needs 3:1 for large text
1.9:1
Fail
Carrefour gray and neutral colors
The quiet part of the Carrefour palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Carrefour Light GrayBackground
- HEX
- RGB
- HSL
- Carrefour Surface GraySurface
- HEX
- RGB
- HSL
- Carrefour Border GrayBorder
- HEX
- RGB
- HSL
- Carrefour CharcoalText
- HEX
- RGB
- HSL
- Carrefour Medium GraySecondary text
- HEX
- RGB
- HSL
- Carrefour Muted GrayMuted text
- HEX
- RGB
- HSL
About Carrefour's colors
Carrefour's palette is based on the French tricolor, using blue, red, and white for strong brand recognition and clarity. Neutral grays support accessibility and usability in digital interfaces.
Primary blue and secondary red are complementary and evoke the French flag.
White and light grays provide contrast and readability.
Accent colors like green and yellow are reserved for semantic feedback.
Psychology
Blue conveys trust, reliability, and professionalism, essential for a retail brand. Red adds energy and draws attention to key elements, while neutrals maintain a clean, accessible interface.
Evolution
The core blue and red have remained stable since Carrefour's founding, maintaining strong brand continuity. Minor adjustments to gray tones have been made for digital accessibility.
Where Carrefour uses each color
- Primary
Carrefour Blue is used for navigation bars, primary buttons, and key brand elements.
- Secondary
Carrefour Red highlights promotions, calls to action, and the logo.
- Accent
Carrefour White is used for backgrounds, logo spaces, and text on colored surfaces.
- Backgrounds
Carrefour Light Gray appears as the main page background in digital interfaces.
- Text
Carrefour Charcoal and Medium Gray are used for primary and secondary text, ensuring readability.
- Semantic
Green, yellow, and cyan are used for success, warning, and informational messages respectively.
Carrefour color questions
Hex codes, RGB values, neutrals and how to use the palette.
The Carrefour primary color hex code is #004E9F. This blue is central to the brand's identity.
Carrefour Blue (#004E9F) is RGB(0, 78, 159) and CMYK(100, 51, 0, 38). Use these values for accurate reproduction in print and digital.
Carrefour uses Light Gray (#F5F5F5), Surface Gray (#E6E7E8), and Border Gray (#BFC1C3) for backgrounds and borders. These ensure a clean, accessible interface.
Use Carrefour Blue (#004E9F) for primary actions and navigation, Red (#E30613) for highlights, and White (#FFFFFF) for backgrounds. Neutrals and semantic colors support structure and feedback.
The secondary color is Carrefour Red, #E30613, and the accent is Carrefour White, #FFFFFF. 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 Carrefour's colors consistently when it generates UI.
Make something in the spirit of Carrefour
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.