Toyota color palette
AutomotiveToyota's color identity is defined by its iconic red, paired with a clean palette of white, black, and neutral grays. The palette emphasizes clarity, reliability, and a strong brand presence across all touchpoints.
toyota.comToyota colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Toyota RedPrimary235, 10, 30
- Toyota WhiteSecondary255, 255, 255
- Toyota BlackAccent0, 0, 0
Surfaces
Page, cards and dividers.- Toyota Light GrayBackground246, 246, 246
- Toyota Surface GraySurface229, 229, 229
- Toyota Border GrayBorder198, 198, 198
Text
Three tiers of copy.- Toyota CharcoalText34, 34, 34
- Toyota Medium GraySecondary text102, 102, 102
- Toyota Muted GrayMuted text165, 165, 165
Semantic
Feedback and state colors.- Toyota GreenSuccess0, 154, 68
- Toyota YellowWarning255, 181, 0
- Toyota Error RedError213, 0, 28
- Toyota BlueInfo0, 114, 206
Use Toyota's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
toyota-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #D5001C;
--accent: #000000;
--border: #C6C6C6;
--primary: #EB0A1E;
--success: #009A44;
--surface: #E5E5E5;
--warning: #FFB500;
--secondary: #FFFFFF;
--text-muted: #A5A5A5;
--background: #F6F6F6;
--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.7:1
Pass
Text on surface
Needs 4.5:1 for body text
12.6: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.3:1
Fail
Muted text on surface
Needs 3:1 for large text
2.0:1
Fail
Toyota gray and neutral colors
The quiet part of the Toyota palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Toyota Light GrayBackground
- HEX
- RGB
- HSL
- Toyota Surface GraySurface
- HEX
- RGB
- HSL
- Toyota Border GrayBorder
- HEX
- RGB
- HSL
- Toyota CharcoalText
- HEX
- RGB
- HSL
- Toyota Medium GraySecondary text
- HEX
- RGB
- HSL
- Toyota Muted GrayMuted text
- HEX
- RGB
- HSL
About Toyota's colors
Toyota's palette is anchored by a vivid red, conveying energy and confidence, balanced by neutral whites and grays for clarity and accessibility. The supporting colors provide functional cues and ensure legibility across digital and print media.
Red is used for branding and calls to action.
Neutral grays and white support content clarity.
Accent black and blue provide contrast and informational highlights.
Psychology
Toyota Red evokes passion, excitement, and trust, reinforcing the brand's dynamic image. The neutral tones communicate reliability and professionalism.
Evolution
Toyota has maintained its signature red for decades, with minor adjustments for digital consistency. The supporting palette has evolved to include more refined grays for modern UI needs.
Where Toyota uses each color
- Primary
Toyota Red is used in the logo, primary buttons, and key highlights across digital and print materials.
- Secondary
Toyota White serves as the main background for websites, brochures, and vehicle displays.
- Accent
Toyota Black is used for text, navigation bars, and high-contrast UI elements.
- Backgrounds
Toyota Light Gray is featured in backgrounds for web pages and app screens to provide subtle separation.
- Text
Toyota Charcoal and Medium Gray are used for primary and secondary text to ensure readability.
- Semantic
Toyota Green, Yellow, Error Red, and Blue are used for status indicators, alerts, and informational messaging in digital interfaces.
Toyota color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Toyota primary color hex code is #EB0A1E. This red is used in the logo and key brand elements.
Toyota Red (#EB0A1E) in RGB is 235, 10, 30. In CMYK, it is approximately 0, 96, 87, 8.
Toyota uses several neutral grays: Light Gray (#F6F6F6), Surface Gray (#E5E5E5), Border Gray (#C6C6C6), and Charcoal (#222222) for text.
Toyota Red (#EB0A1E) should be reserved for branding and key actions, while neutrals and black support content and readability. Semantic colors are used for status and alerts in digital products.
The secondary color is Toyota White, #FFFFFF, and the accent is Toyota Black, #000000. 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 Toyota's colors consistently when it generates UI.
Make something in the spirit of Toyota
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.