Guinness color palette
Food & DrinkGuinness uses a distinctive palette centered on deep black, gold, and white, reflecting its iconic stout and heritage. The color system emphasizes contrast and premium cues, especially in packaging and digital interfaces.
guinness.comGuinness colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Guinness BlackPrimary0, 0, 0
- Guinness GoldSecondary175, 138, 70
- Guinness WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- Guinness Deep BlackBackground18, 18, 18
- Guinness CharcoalSurface34, 34, 34
- Guinness Pale GoldBorder203, 178, 106
Text
Three tiers of copy.- Guinness WhiteText255, 255, 255
- Guinness Pale GoldSecondary text203, 178, 106
- Guinness Silver GrayMuted text176, 176, 176
Semantic
Feedback and state colors.- Guinness GoldSuccess175, 138, 70
- Guinness Light GoldWarning229, 201, 123
- Guinness Deep RedError169, 68, 66
- Guinness Slate GrayInfo108, 117, 125
Use Guinness's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
guinness-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #6C757D;
--error: #A94442;
--accent: #FFFFFF;
--border: #CBB26A;
--primary: #000000;
--success: #AF8A46;
--surface: #222222;
--warning: #E5C97B;
--secondary: #AF8A46;
--text-muted: #B0B0B0;
--background: #121212;
--text-primary: #FFFFFF;
--text-secondary: #CBB26A;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
18.7:1
Pass
Text on surface
Needs 4.5:1 for body text
15.9:1
Pass
Secondary text on background
Needs 4.5:1 for body text
9.0:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.7:1
Pass
Muted text on background
Needs 3:1 for large text
8.6:1
Pass
Muted text on surface
Needs 3:1 for large text
7.3:1
Pass
Guinness background, border and text colors
Guinness runs a dark interface, so these grays carry the layout: background, sidebar surfaces, dividers and three tiers of text. Click a value to copy it.
- Guinness Deep BlackBackground
- HEX
- RGB
- HSL
- Guinness CharcoalSurface
- HEX
- RGB
- HSL
- Guinness Pale GoldBorder
- HEX
- RGB
- HSL
- Guinness WhiteText
- HEX
- RGB
- HSL
- Guinness Pale GoldSecondary text
- HEX
- RGB
- HSL
- Guinness Silver GrayMuted text
- HEX
- RGB
- HSL
About Guinness's colors
Guinness’s color palette is built on high-contrast black and gold, evoking luxury and tradition. White and muted grays provide clarity and balance for digital and print applications.
Primary black contrasts with gold for premium effect.
Gold and pale gold are used for highlights and accents.
White and gray tones support readability and structure.
Psychology
Black conveys sophistication, strength, and heritage, while gold signals quality and prestige. The palette is designed to evoke trust and timelessness.
Evolution
Guinness’s palette has remained largely stable, with black and gold at its core for decades. Digital adaptations have introduced more nuanced grays for UI clarity.
Where Guinness uses each color
- Primary
Guinness Black is used for backgrounds, packaging, and primary navigation bars.
- Secondary
Guinness Gold highlights logos, seals, and key accents on cans, bottles, and web banners.
- Accent
Guinness White is used for text, foam graphics, and contrast elements.
- Backgrounds
Deep Black and Charcoal are used for app screens, website backgrounds, and print materials.
- Text
White and Pale Gold are used for headings, body text, and navigation links.
- Semantic
Gold is used for success states, Light Gold for warnings, Deep Red for errors, and Slate Gray for informational messages.
Guinness color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Guinness brand color is Guinness Black, hex code #000000.
Guinness Black is RGB(0, 0, 0) and typically CMYK(0, 0, 0, 100).
Guinness uses Deep Black (#121212), Charcoal (#222222), and Silver Gray (#B0B0B0) for backgrounds and muted UI elements.
Use Guinness Black (#000000) for dominant backgrounds, Gold (#AF8A46) for highlights, and White (#FFFFFF) for text and contrast. Grays and pale golds support secondary UI and text roles.
The secondary color is Guinness Gold, #AF8A46, and the accent is Guinness 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 Guinness's colors consistently when it generates UI.
Make something in the spirit of Guinness
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.