Renault color palette
AutomotiveRenault's color identity is anchored by its signature yellow, paired with deep blacks and neutral greys for a bold, modern automotive look. The palette is consistent across digital and physical brand touchpoints.
renault.comRenault colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Renault YellowPrimary255, 204, 51
- Renault BlackSecondary0, 0, 0
- Renault WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- Renault Light GreyBackground245, 245, 245
- Renault Surface GreySurface229, 229, 229
- Renault Border GreyBorder189, 189, 189
Text
Three tiers of copy.- Renault CharcoalText26, 26, 26
- Renault Medium GreySecondary text85, 85, 85
- Renault Muted GreyMuted text140, 140, 140
Semantic
Feedback and state colors.- Renault Success GreenSuccess122, 201, 67
- Renault Warning OrangeWarning255, 153, 0
- Renault Error RedError208, 2, 27
- Renault Info BlueInfo0, 114, 206
Use Renault's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
renault-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #D0021B;
--accent: #FFFFFF;
--border: #BDBDBD;
--primary: #FFCC33;
--success: #7AC943;
--surface: #E5E5E5;
--warning: #FF9900;
--secondary: #000000;
--text-muted: #8C8C8C;
--background: #F5F5F5;
--text-primary: #1A1A1A;
--text-secondary: #555555;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
16.0:1
Pass
Text on surface
Needs 4.5:1 for body text
13.8:1
Pass
Secondary text on background
Needs 4.5:1 for body text
6.8:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.9:1
Pass
Muted text on background
Needs 3:1 for large text
3.1:1
Pass
Muted text on surface
Needs 3:1 for large text
2.7:1
Fail
Renault gray and neutral colors
The quiet part of the Renault palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Renault Light GreyBackground
- HEX
- RGB
- HSL
- Renault Surface GreySurface
- HEX
- RGB
- HSL
- Renault Border GreyBorder
- HEX
- RGB
- HSL
- Renault CharcoalText
- HEX
- RGB
- HSL
- Renault Medium GreySecondary text
- HEX
- RGB
- HSL
- Renault Muted GreyMuted text
- HEX
- RGB
- HSL
About Renault's colors
Renault's palette is built around high-contrast yellow and black, evoking energy and clarity. The supporting greys and accent colors provide a functional, modern interface.
Primary yellow contrasts with deep black for maximum visibility.
Neutral greys balance the vivid yellow in UI backgrounds.
Accent white ensures clarity and separation in layouts.
Psychology
The yellow symbolizes optimism, innovation, and approachability, while black conveys strength and sophistication. Together, they create a dynamic and trustworthy brand presence.
Evolution
Renault has consistently used yellow and black since the 1970s, with minor adjustments to yellow's tone for digital clarity. The current palette emphasizes accessibility and digital usability.
Where Renault uses each color
- Primary
Renault Yellow is used for logos, primary buttons, and key highlights across digital and print assets.
- Secondary
Renault Black appears in navigation bars, footers, and as a background for the logo.
- Accent
Renault White is used for text on dark backgrounds and as a secondary background color.
- Backgrounds
Renault Light Grey and Surface Grey are used for UI backgrounds and content areas.
- Text
Renault Charcoal and Medium Grey are used for primary and secondary text respectively.
- Semantic
Success Green, Warning Orange, Error Red, and Info Blue are used for alerts, notifications, and status indicators.
Renault color questions
Hex codes, RGB values, neutrals and how to use the palette.
The Renault primary color hex code is #FFCC33. This yellow is central to the brand's identity.
Renault Yellow (#FFCC33) is RGB(255, 204, 51) and CMYK(0, 20, 80, 0). These values ensure color consistency across media.
Renault uses Light Grey (#F5F5F5), Surface Grey (#E5E5E5), Border Grey (#BDBDBD), and Charcoal (#1A1A1A) for UI and backgrounds. These neutrals provide balance and readability.
Use Renault Yellow (#FFCC33) for primary CTAs and highlights, with Black (#000000) and White (#FFFFFF) for contrast. Greys structure backgrounds and surfaces, while semantic colors are reserved for status and alerts.
The secondary color is Renault Black, #000000, and the accent is Renault White, #FFFFFF. Together with the primary they make up the three brand colors at the top of this page.
5 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 Renault's colors consistently when it generates UI.
Make something in the spirit of Renault
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.