Taco Bell color palette
Food & DrinkTaco Bell's color identity is defined by its bold purple primary, complemented by vibrant accent colors and distinctive dark and neutral tones. The palette is designed for high contrast and brand recognition across digital and physical touchpoints.
tacobell.comTaco Bell colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Taco Bell PurplePrimary56, 9, 108
- Taco Bell PinkSecondary213, 0, 127
- Taco Bell YellowAccent243, 230, 0
Surfaces
Page, cards and dividers.- Taco Bell WhiteBackground255, 255, 255
- Taco Bell Light GraySurface246, 246, 246
- Taco Bell Gray BorderBorder214, 214, 214
Text
Three tiers of copy.- Taco Bell BlackText25, 25, 25
- Taco Bell Dark GraySecondary text102, 102, 102
- Taco Bell Muted GrayMuted text161, 161, 161
Semantic
Feedback and state colors.- Taco Bell GreenSuccess67, 176, 42
- Taco Bell OrangeWarning255, 184, 0
- Taco Bell RedError228, 0, 43
- Taco Bell BlueInfo0, 185, 241
Use Taco Bell's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
taco-bell-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #00B9F1;
--error: #E4002B;
--accent: #F3E600;
--border: #D6D6D6;
--primary: #38096C;
--success: #43B02A;
--surface: #F6F6F6;
--warning: #FFB800;
--secondary: #D5007F;
--text-muted: #A1A1A1;
--background: #FFFFFF;
--text-primary: #191919;
--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
17.6:1
Pass
Text on surface
Needs 4.5:1 for body text
16.3:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.7:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.3:1
Pass
Muted text on background
Needs 3:1 for large text
2.6:1
Fail
Muted text on surface
Needs 3:1 for large text
2.4:1
Fail
Taco Bell gray and neutral colors
The quiet part of the Taco Bell palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Taco Bell WhiteBackground
- HEX
- RGB
- HSL
- Taco Bell Light GraySurface
- HEX
- RGB
- HSL
- Taco Bell Gray BorderBorder
- HEX
- RGB
- HSL
- Taco Bell BlackText
- HEX
- RGB
- HSL
- Taco Bell Dark GraySecondary text
- HEX
- RGB
- HSL
- Taco Bell Muted GrayMuted text
- HEX
- RGB
- HSL
About Taco Bell's colors
Taco Bell's palette uses a bold purple as its anchor, supported by energetic accent colors for vibrancy and contrast. Neutrals and dark tones provide balance and legibility in digital and print applications.
Primary purple contrasts with yellow and pink accents.
Neutrals support readability and UI clarity.
Accent colors highlight key actions and promotions.
Psychology
Purple conveys creativity and uniqueness, setting Taco Bell apart in the fast food space. Bright accents evoke excitement and approachability.
Evolution
Taco Bell's palette shifted to a more modern, vibrant purple in the 2016 rebrand, moving away from the previous teal and pink. The current system has remained stable since, focusing on digital clarity and brand distinctiveness.
Where Taco Bell uses each color
- Primary
Used in the Taco Bell logo, navigation bars, and key brand elements.
- Secondary
Appears in promotional banners, call-to-action buttons, and select packaging.
- Accent
Highlights limited-time offers, featured menu items, and special UI elements.
- Backgrounds
White and light gray backgrounds are used for app screens, menus, and website sections.
- Text
Black and dark gray are used for primary and secondary text across digital and print.
- Semantic
Green, orange, red, and blue are used for status indicators, alerts, and informational messages in the app and website.
Taco Bell color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Taco Bell primary color is #38096C, known as Taco Bell Purple. Use this exact hex for all primary brand applications.
Taco Bell Purple (#38096C) is RGB(56, 9, 108) and CMYK(48, 92, 0, 58). Always match the hex for digital use.
Taco Bell uses #F6F6F6 (Light Gray), #D6D6D6 (Gray Border), #191919 (Black), #666666 (Dark Gray), and #A1A1A1 (Muted Gray) for backgrounds, borders, and text. These ensure clarity and contrast in UI design.
Use #38096C as the dominant brand color, with accent and secondary colors for highlights and calls to action. Neutrals should be used for backgrounds and text to maintain readability and brand consistency.
The secondary color is Taco Bell Pink, #D5007F, and the accent is Taco Bell Yellow, #F3E600. 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 Taco Bell's colors consistently when it generates UI.
Make something in the spirit of Taco Bell
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.