McDonald's color palette
ConsumerMcDonald's golden arches and red-yellow palette create one of the most recognized fast-food identities in the world, designed to stimulate appetite and communicate family-friendly energy.
mcdonalds.comMcDonald's colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- McDonald's GoldPrimary255, 199, 44
- McDonald's RedSecondary218, 41, 28
- McDonald's BlackAccent39, 37, 31
Surfaces
Page, cards and dividers.- McDonald's WhiteBackground255, 255, 255
- McDonald's CreamSurface245, 240, 229
- McDonald's BorderBorder232, 224, 208
Text
Three tiers of copy.- McDonald's TextText39, 37, 31
- McDonald's SecondarySecondary text111, 111, 111
- McDonald's MutedMuted text153, 153, 153
Semantic
Feedback and state colors.- McDonald's GreenSuccess38, 79, 54
- McDonald's WarningWarning255, 199, 44
- McDonald's ErrorError218, 41, 28
- McDonald's BlueInfo0, 93, 170
Use McDonald's's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
mcdonalds-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #005DAA;
--error: #DA291C;
--accent: #27251F;
--border: #E8E0D0;
--primary: #FFC72C;
--success: #264F36;
--surface: #F5F0E5;
--warning: #FFC72C;
--secondary: #DA291C;
--text-muted: #999999;
--background: #FFFFFF;
--text-primary: #27251F;
--text-secondary: #6F6F6F;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
15.3:1
Pass
Text on surface
Needs 4.5:1 for body text
13.5:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.0:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.4:1
Fail
Muted text on background
Needs 3:1 for large text
2.8:1
Fail
Muted text on surface
Needs 3:1 for large text
2.5:1
Fail
McDonald's background, border and text colors
The quiet part of the McDonald's palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- McDonald's WhiteBackground
- HEX
- RGB
- HSL
- McDonald's CreamSurface
- HEX
- RGB
- HSL
- McDonald's BorderBorder
- HEX
- RGB
- HSL
- McDonald's TextText
- HEX
- RGB
- HSL
- McDonald's SecondarySecondary text
- HEX
- RGB
- HSL
- McDonald's MutedMuted text
- HEX
- RGB
- HSL
About McDonald's's colors
McDonald's red-and-yellow palette is rooted in color psychology — the two colors most associated with appetite stimulation and impulse. This isn't accidental; it's one of the most studied color combinations in fast-food branding.
Red and yellow are adjacent warm colors that create maximum visual energy
Gold has shifted to dominate over red in recent years, signaling premium modernization
Green accents in European markets signal sustainability and natural ingredients
Psychology
Red stimulates appetite and creates urgency. Yellow evokes happiness, warmth, and the sun. Together they trigger hunger and positive associations — making them the most effective color combination in fast-food history.
Evolution
McDonald's has gradually shifted emphasis from red-dominant to gold-dominant branding, reflecting a move toward perceived quality and modernity. The European green-and-gold variant launched around 2009 to signal sustainability.
Where McDonald's uses each color
- Primary
Golden yellow (#FFC72C) now leads the brand, representing the iconic arches and premium positioning.
- Secondary
Red (#DA291C) provides energy in promotional elements, value messaging, and the classic brand pairing.
- Accent
Black (#27251F) adds sophistication in typography and the McCafé sub-brand.
- Backgrounds
Warm cream surfaces (#F5F0E5) replace clinical white, adding warmth consistent with the food-centric brand.
- Text
Warm near-black text (#27251F) with brown undertones maintains the approachable, non-corporate feel.
- Semantic
Green (#264F36) appears in fresh/healthy messaging, while red naturally serves as both brand and error color.
McDonald's color questions
Hex codes, RGB values, neutrals and how to use the palette.
McDonald's primary colors are Golden Yellow (#FFC72C) for the arches and Red (#DA291C) for the brand background. The exact shades have been standardized globally, though regional variations exist (European markets use green).
Red and yellow are the two colors most associated with appetite stimulation in color psychology. Red creates urgency and excitement, while yellow evokes happiness and warmth. This combination is intentionally designed to attract hungry customers.
McDonald's introduced green branding in European markets around 2009 as part of a sustainability initiative. The green-and-gold combination replaced the traditional red-and-yellow in many European restaurants to convey environmental responsibility.
McDonald's's primary color is McDonald's Gold, hex #FFC72C (RGB 255, 199, 44). It is the color used for the logo and the most prominent brand moments.
The secondary color is McDonald's Red, #DA291C, and the accent is McDonald's Black, #27251F. Together with the primary they make up the three brand colors at the top of this page.
McDonald's uses #FFFFFF for backgrounds, #F5F0E5 for surfaces and #E8E0D0 for borders. Text runs #27251F, #6F6F6F and #999999 from strongest to most muted.
3 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 McDonald's's colors consistently when it generates UI.
Make something in the spirit of McDonald's
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.