Popeyes color palette
Food & DrinkPopeyes uses a bold, vibrant orange as its signature color, paired with warm neutrals and deep browns to evoke its Louisiana heritage. The palette is distinctive and energetic, reflecting the brand's spicy, flavorful food.
popeyes.comPopeyes colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Popeyes OrangePrimary255, 105, 0
- Popeyes WhiteSecondary255, 255, 255
- Popeyes GoldAccent255, 199, 44
Surfaces
Page, cards and dividers.- Popeyes CreamBackground255, 245, 230
- Popeyes BiscuitSurface247, 231, 209
- Popeyes Border OrangeBorder226, 106, 44
Text
Three tiers of copy.- Popeyes BrownText45, 22, 6
- Popeyes Light BrownSecondary text160, 90, 44
- Popeyes Muted TanMuted text201, 183, 162
Semantic
Feedback and state colors.- Popeyes Success GreenSuccess60, 179, 113
- Popeyes Warning YellowWarning255, 179, 0
- Popeyes Error RedError215, 38, 61
- Popeyes Info BlueInfo0, 151, 169
Use Popeyes's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
popeyes-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0097A9;
--error: #D7263D;
--accent: #FFC72C;
--border: #E26A2C;
--primary: #FF6900;
--success: #3CB371;
--surface: #F7E7D1;
--warning: #FFB300;
--secondary: #FFFFFF;
--text-muted: #C9B7A2;
--background: #FFF5E6;
--text-primary: #2D1606;
--text-secondary: #A05A2C;
}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.8:1
Pass
Text on surface
Needs 4.5:1 for body text
14.1:1
Pass
Secondary text on background
Needs 4.5:1 for body text
4.9:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.3:1
Fail
Muted text on background
Needs 3:1 for large text
1.8:1
Fail
Muted text on surface
Needs 3:1 for large text
1.6:1
Fail
Popeyes background, border and text colors
The quiet part of the Popeyes palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Popeyes CreamBackground
- HEX
- RGB
- HSL
- Popeyes BiscuitSurface
- HEX
- RGB
- HSL
- Popeyes Border OrangeBorder
- HEX
- RGB
- HSL
- Popeyes BrownText
- HEX
- RGB
- HSL
- Popeyes Light BrownSecondary text
- HEX
- RGB
- HSL
- Popeyes Muted TanMuted text
- HEX
- RGB
- HSL
About Popeyes's colors
Popeyes' color system is rooted in a vibrant orange, supported by warm, food-inspired neutrals and accent gold. The palette is designed to evoke appetite and Southern hospitality.
Primary orange is complemented by gold and cream.
Deep browns provide contrast for text and UI.
Accent colors are used sparingly for highlights and status.
Psychology
Orange stimulates hunger and excitement, making it ideal for a fast food brand. The warm neutrals and browns suggest comfort, tradition, and approachability.
Evolution
Popeyes' palette has centered on orange since its major rebrand in 2019, shifting from a more muted scheme to a brighter, more energetic identity. The supporting colors have remained consistent, with minor adjustments to improve accessibility and digital clarity.
Where Popeyes uses each color
- Primary
Popeyes Orange is used for main buttons, headers, and key brand elements across digital and packaging.
- Secondary
Popeyes White is the default background for most web and print applications.
- Accent
Popeyes Gold highlights limited-time offers, callouts, and select UI elements.
- Backgrounds
Popeyes Cream and Biscuit are used as background shades for cards, sections, and packaging.
- Text
Popeyes Brown and Light Brown are used for primary and secondary text, ensuring readability.
- Semantic
Success, warning, error, and info colors are used for status indicators in digital experiences.
Popeyes color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Popeyes brand color is orange with the hex code #FF6900.
Popeyes Orange is #FF6900, which is RGB(255, 105, 0) and CMYK(0, 59, 100, 0).
Popeyes uses #2D1606 (Popeyes Brown) for primary text and #FFF5E6 (Popeyes Cream) for backgrounds, ensuring contrast and warmth.
Use #FF6900 (Popeyes Orange) for primary actions and branding, with supporting colors like #FFC72C (Gold) and #2D1606 (Brown) for accents and text. Maintain high contrast for accessibility and brand consistency.
The secondary color is Popeyes White, #FFFFFF, and the accent is Popeyes Gold, #FFC72C. Together with the primary they make up the three brand colors at the top of this page.
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 Popeyes's colors consistently when it generates UI.
Make something in the spirit of Popeyes
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.