Zendesk color palette
SaaSZendesk's color identity centers around a deep green primary, complemented by warm neutrals and subtle accent tones. The palette is designed for clarity, approachability, and a calm, professional interface.
zendesk.comZendesk colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Zendesk GreenPrimary3, 54, 61
- Zendesk SandSecondary245, 243, 238
- Zendesk GoldAccent246, 166, 35
Surfaces
Page, cards and dividers.- Zendesk WhiteBackground255, 255, 255
- Zendesk Light GraySurface248, 248, 248
- Zendesk Border GrayBorder216, 220, 219
Text
Three tiers of copy.- Zendesk Green TextText3, 54, 61
- Zendesk SlateSecondary text104, 115, 125
- Zendesk Muted GrayMuted text161, 169, 176
Semantic
Feedback and state colors.- Zendesk Success GreenSuccess67, 179, 36
- Zendesk Warning GoldWarning246, 166, 35
- Zendesk Error RedError224, 62, 47
- Zendesk Info BlueInfo47, 143, 237
Use Zendesk's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
zendesk-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #2F8FED;
--error: #E03E2F;
--accent: #F6A623;
--border: #D8DCDB;
--primary: #03363D;
--success: #43B324;
--surface: #F8F8F8;
--warning: #F6A623;
--secondary: #F5F3EE;
--text-muted: #A1A9B0;
--background: #FFFFFF;
--text-primary: #03363D;
--text-secondary: #68737D;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
13.1:1
Pass
Text on surface
Needs 4.5:1 for body text
12.4:1
Pass
Secondary text on background
Needs 4.5:1 for body text
4.8:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.6: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.2:1
Fail
Zendesk background, border and text colors
The quiet part of the Zendesk palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Zendesk WhiteBackground
- HEX
- RGB
- HSL
- Zendesk Light GraySurface
- HEX
- RGB
- HSL
- Zendesk Border GrayBorder
- HEX
- RGB
- HSL
- Zendesk Green TextText
- HEX
- RGB
- HSL
- Zendesk SlateSecondary text
- HEX
- RGB
- HSL
- Zendesk Muted GrayMuted text
- HEX
- RGB
- HSL
About Zendesk's colors
Zendesk's palette uses a deep green as its anchor, supported by warm neutrals and clear semantic colors for UI clarity. The system emphasizes calm, trust, and accessibility throughout its interface.
Primary green contrasts with warm sand backgrounds.
Accent gold highlights actions and notifications.
Neutral grays provide structure and readability.
Psychology
The deep green conveys trust, stability, and professionalism, while the warm neutrals create a welcoming and approachable feel. Accent colors are used sparingly to draw attention without overwhelming the user.
Evolution
Zendesk's palette has remained consistent since its major rebrand, maintaining the signature green and sand tones. Adjustments have focused on accessibility and subtle refinements to neutral shades.
Where Zendesk uses each color
- Primary
Zendesk Green is used for the logo, primary navigation, and key action buttons.
- Secondary
Zendesk Sand appears as the main background on marketing and product pages.
- Accent
Zendesk Gold is used for highlights, notifications, and call-to-action elements.
- Backgrounds
White and Light Gray backgrounds are used throughout app screens and support content.
- Text
Primary and secondary text colors are used for headings, body copy, and muted UI elements.
- Semantic
Success, warning, error, and info colors are applied to alerts, badges, and status indicators.
Zendesk color questions
Hex codes, RGB values, neutrals and how to use the palette.
The Zendesk primary color is #03363D, known as Zendesk Green. This color is used for branding and key UI elements.
Zendesk Green (#03363D) has an RGB value of 3, 54, 61. For print, its approximate CMYK is 95, 35, 45, 80.
Zendesk uses #F8F8F8 (Light Gray), #D8DCDB (Border Gray), and #A1A9B0 (Muted Gray) as its primary UI neutrals. These provide structure and contrast across the interface.
Use #03363D for primary actions and branding, with #F5F3EE and #F8F8F8 as backgrounds. Accent and semantic colors should be reserved for highlights, alerts, and status indicators.
The secondary color is Zendesk Sand, #F5F3EE, and the accent is Zendesk Gold, #F6A623. 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 Zendesk's colors consistently when it generates UI.
Make something in the spirit of Zendesk
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.