Goodyear color palette
AutomotiveGoodyear's color identity is defined by its iconic blue and yellow, reflecting trust, reliability, and energy. The palette is stable and instantly recognizable in the automotive sector.
goodyear.comGoodyear colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Goodyear BluePrimary0, 48, 87
- Goodyear YellowSecondary255, 209, 0
- Goodyear WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- Goodyear Light GrayBackground244, 244, 244
- Goodyear Surface GraySurface229, 229, 229
- Goodyear Border GrayBorder196, 196, 196
Text
Three tiers of copy.- Goodyear Blue TextText0, 48, 87
- Goodyear Dark TextSecondary text34, 34, 34
- Goodyear Muted GrayMuted text109, 110, 113
Semantic
Feedback and state colors.- Goodyear Success GreenSuccess75, 181, 67
- Goodyear Warning YellowWarning255, 184, 0
- Goodyear Error RedError210, 38, 48
- Goodyear Info BlueInfo0, 114, 206
Use Goodyear's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
goodyear-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #D22630;
--accent: #FFFFFF;
--border: #C4C4C4;
--primary: #003057;
--success: #4BB543;
--surface: #E5E5E5;
--warning: #FFB800;
--secondary: #FFD100;
--text-muted: #6D6E71;
--background: #F4F4F4;
--text-primary: #003057;
--text-secondary: #222222;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
12.2:1
Pass
Text on surface
Needs 4.5:1 for body text
10.7:1
Pass
Secondary text on background
Needs 4.5:1 for body text
14.5:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
12.6:1
Pass
Muted text on background
Needs 3:1 for large text
4.6:1
Pass
Muted text on surface
Needs 3:1 for large text
4.0:1
Pass
Goodyear background, border and text colors
The quiet part of the Goodyear palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Goodyear Light GrayBackground
- HEX
- RGB
- HSL
- Goodyear Surface GraySurface
- HEX
- RGB
- HSL
- Goodyear Border GrayBorder
- HEX
- RGB
- HSL
- Goodyear Blue TextText
- HEX
- RGB
- HSL
- Goodyear Dark TextSecondary text
- HEX
- RGB
- HSL
- Goodyear Muted GrayMuted text
- HEX
- RGB
- HSL
About Goodyear's colors
Goodyear's palette is built on a strong blue and vibrant yellow, creating a high-contrast, energetic identity. The colors are chosen for visibility and brand recognition in automotive contexts.
Primary blue and yellow are complementary and create strong visual impact.
Neutrals provide clarity and balance for UI and print.
Accent white ensures legibility and contrast.
Psychology
Blue conveys trust, dependability, and professionalism, aligning with Goodyear's brand values. Yellow adds energy and draws attention, suitable for safety and visibility.
Evolution
Goodyear's core blue and yellow have remained consistent for decades, reinforcing brand recognition. Minor adjustments to gray tones and supporting colors have been made for digital clarity.
Where Goodyear uses each color
- Primary
Goodyear Blue is used for the logo, navigation bars, and key brand backgrounds.
- Secondary
Goodyear Yellow highlights buttons, calls to action, and important UI elements.
- Accent
Goodyear White is used for text on dark backgrounds and as a secondary background.
- Backgrounds
Goodyear Light Gray is the main background for web pages and digital applications.
- Text
Goodyear Blue and Dark Text are used for primary and secondary text throughout the site.
- Semantic
Success, warning, and error colors are used for status indicators, alerts, and notifications.
Goodyear color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Goodyear primary brand color is Goodyear Blue, hex code #003057.
Goodyear Blue (#003057) in RGB is 0, 48, 87. In CMYK, it is 100, 45, 0, 66.
Goodyear uses Light Gray (#F4F4F4), Surface Gray (#E5E5E5), and Border Gray (#C4C4C4) for backgrounds, surfaces, and borders.
Primary blue and yellow should dominate key brand elements, while grays and white provide structure and legibility. Always use the exact hex codes for consistency: #003057, #FFD100, #FFFFFF, and supporting grays.
The secondary color is Goodyear Yellow, #FFD100, and the accent is Goodyear White, #FFFFFF. 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 Goodyear's colors consistently when it generates UI.
Make something in the spirit of Goodyear
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.