Keurig color palette
Food & DrinkKeurig's brand color system is centered around a distinctive deep green, paired with neutral darks and metallic accents to evoke quality and sophistication. The palette is used consistently across packaging, digital interfaces, and marketing materials.
keurig.comKeurig colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Keurig GreenPrimary25, 90, 44
- Keurig GoldSecondary168, 153, 110
- Keurig BronzeAccent199, 178, 153
Surfaces
Page, cards and dividers.- Keurig CreamBackground245, 245, 241
- Keurig WhiteSurface255, 255, 255
- Keurig Light GrayBorder216, 216, 216
Text
Three tiers of copy.- Keurig CharcoalText34, 34, 34
- Keurig Medium GraySecondary text102, 102, 102
- Keurig Muted GrayMuted text160, 160, 160
Semantic
Feedback and state colors.- Keurig Success GreenSuccess75, 170, 80
- Keurig Warning YellowWarning247, 201, 72
- Keurig Error RedError214, 69, 69
- Keurig Info BlueInfo58, 124, 165
Use Keurig's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
keurig-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #3A7CA5;
--error: #D64545;
--accent: #C7B299;
--border: #D8D8D8;
--primary: #195A2C;
--success: #4BAA50;
--surface: #FFFFFF;
--warning: #F7C948;
--secondary: #A8996E;
--text-muted: #A0A0A0;
--background: #F5F5F1;
--text-primary: #222222;
--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
14.6: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
5.3:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.7:1
Pass
Muted text on background
Needs 3:1 for large text
2.4:1
Fail
Muted text on surface
Needs 3:1 for large text
2.6:1
Fail
Keurig background, border and text colors
The quiet part of the Keurig palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Keurig CreamBackground
- HEX
- RGB
- HSL
- Keurig WhiteSurface
- HEX
- RGB
- HSL
- Keurig Light GrayBorder
- HEX
- RGB
- HSL
- Keurig CharcoalText
- HEX
- RGB
- HSL
- Keurig Medium GraySecondary text
- HEX
- RGB
- HSL
- Keurig Muted GrayMuted text
- HEX
- RGB
- HSL
About Keurig's colors
Keurig's palette is rooted in an earthy, premium green, complemented by metallic and neutral tones for a sophisticated feel. The colors are chosen to evoke freshness, reliability, and approachability.
Primary green is contrasted with gold and bronze for premium cues.
Neutrals provide a clean, modern backdrop for product imagery.
Accent metallics highlight key actions and features.
Psychology
The deep green suggests freshness and sustainability, while gold and bronze accents communicate quality and warmth. Neutral backgrounds keep the focus on products and reinforce a sense of cleanliness.
Evolution
Keurig's color palette has remained stable, with the green and metallics being core to its identity since inception. Minor adjustments have been made to neutrals for digital clarity.
Where Keurig uses each color
- Primary
Keurig Green is used for the logo, primary buttons, and key navigation elements.
- Secondary
Keurig Gold appears in packaging details, highlights, and select UI elements.
- Accent
Keurig Bronze is used for subtle accents and secondary highlights on packaging and web.
- Backgrounds
Keurig Cream and White are used for website backgrounds and product photography.
- Text
Keurig Charcoal and Medium Gray are used for primary and secondary text across digital and print.
- Semantic
Success, warning, error, and info colors are used for notifications, alerts, and system feedback in digital products.
Keurig color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Keurig brand green is #195A2C, known as Keurig Green.
Keurig Green (#195A2C) is RGB(25, 90, 44); for print, use CMYK(72, 0, 51, 65).
Keurig uses Keurig Cream (#F5F5F1) and Keurig White (#FFFFFF) for backgrounds, with Keurig Charcoal (#222222) and Keurig Medium Gray (#666666) for text.
Use Keurig Green (#195A2C) for brand-defining elements, metallics for accents, and neutrals for backgrounds and text to maintain clarity and brand consistency.
The secondary color is Keurig Gold, #A8996E, and the accent is Keurig Bronze, #C7B299. 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 Keurig's colors consistently when it generates UI.
Make something in the spirit of Keurig
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.