Wingstop color palette
Food & DrinkWingstop's brand identity is defined by its signature deep green paired with crisp white and dark gray accents, reflecting a classic, bold, and appetizing look. The palette is consistent across digital, print, and in-store materials.
wingstop.comWingstop colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Wingstop GreenPrimary0, 99, 65
- Wingstop WhiteSecondary255, 255, 255
- Wingstop GoldAccent255, 215, 0
Surfaces
Page, cards and dividers.- Wingstop Light GrayBackground245, 245, 245
- Wingstop Surface GraySurface229, 229, 229
- Wingstop Border GrayBorder209, 213, 216
Text
Three tiers of copy.- Wingstop BlackText34, 34, 34
- Wingstop CharcoalSecondary text74, 74, 74
- Wingstop Muted GrayMuted text140, 140, 140
Semantic
Feedback and state colors.- Wingstop Success GreenSuccess46, 133, 64
- Wingstop Warning YellowWarning255, 184, 0
- Wingstop Error RedError215, 38, 61
- Wingstop Info TealInfo0, 124, 108
Use Wingstop's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
wingstop-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #007C6C;
--error: #D7263D;
--accent: #FFD700;
--border: #D1D5D8;
--primary: #006341;
--success: #2E8540;
--surface: #E5E5E5;
--warning: #FFB800;
--secondary: #FFFFFF;
--text-muted: #8C8C8C;
--background: #F5F5F5;
--text-primary: #222222;
--text-secondary: #4A4A4A;
}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.6: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
8.1:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.0: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
Wingstop gray and neutral colors
The quiet part of the Wingstop palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Wingstop Light GrayBackground
- HEX
- RGB
- HSL
- Wingstop Surface GraySurface
- HEX
- RGB
- HSL
- Wingstop Border GrayBorder
- HEX
- RGB
- HSL
- Wingstop BlackText
- HEX
- RGB
- HSL
- Wingstop CharcoalSecondary text
- HEX
- RGB
- HSL
- Wingstop Muted GrayMuted text
- HEX
- RGB
- HSL
About Wingstop's colors
Wingstop's palette is anchored by a deep green, evoking freshness and appetite, complemented by white and muted grays for clarity and contrast. Gold and accent tones add vibrancy and highlight key actions or promotions.
Primary green contrasts with white for high legibility.
Gold accent draws attention to calls-to-action.
Grays provide neutral backgrounds and structure.
Psychology
Green is associated with freshness, quality, and appetite, reinforcing Wingstop's food-forward identity. Gold conveys a sense of value and indulgence, while the neutral tones keep the presentation clean and modern.
Evolution
Wingstop's color palette has remained stable over time, with the deep green consistently serving as the brand's anchor. Minor adjustments have been made to accent and neutral tones to improve digital accessibility and consistency.
Where Wingstop uses each color
- Primary
Wingstop Green is used for the logo, navigation bar, and primary buttons.
- Secondary
Wingstop White is used for backgrounds, packaging, and text on dark backgrounds.
- Accent
Wingstop Gold is used for highlights, promotional banners, and call-to-action buttons.
- Backgrounds
Wingstop Light Gray and Surface Gray are used for app and website backgrounds.
- Text
Wingstop Black and Charcoal are used for headings and body text, with Muted Gray for secondary information.
- Semantic
Success Green, Warning Yellow, Error Red, and Info Teal are used for status indicators and alerts in digital interfaces.
Wingstop color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Wingstop brand green is #006341, known as Wingstop Green.
Wingstop Green (#006341) is RGB(0, 99, 65) and CMYK(100, 0, 34, 61).
Wingstop uses several grays for backgrounds and borders, including #F5F5F5 (Light Gray), #E5E5E5 (Surface Gray), and #D1D5D8 (Border Gray).
Use Wingstop Green (#006341) for primary branding elements and actions, with white and grays for backgrounds and text. Gold (#FFD700) should be reserved for accents and promotional highlights.
The secondary color is Wingstop White, #FFFFFF, and the accent is Wingstop Gold, #FFD700. 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 Wingstop's colors consistently when it generates UI.
Make something in the spirit of Wingstop
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.