GitLab color palette
TechGitLab's color identity is defined by its distinctive orange, supported by a palette of purples, grays, and accent colors that reflect its brand and UI. The palette is consistent across product, marketing, and digital assets.
about.gitlab.comGitLab colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- GitLab OrangePrimary252, 109, 38
- GitLab PurpleSecondary107, 79, 187
- GitLab RedAccent226, 67, 41
Surfaces
Page, cards and dividers.- GitLab WhiteBackground255, 255, 255
- GitLab Surface GraySurface245, 246, 250
- GitLab Border GrayBorder229, 229, 229
Text
Three tiers of copy.- GitLab CharcoalText46, 46, 46
- GitLab Medium GraySecondary text107, 107, 107
- GitLab Light GrayMuted text158, 158, 158
Semantic
Feedback and state colors.- GitLab GreenSuccess56, 142, 60
- GitLab YellowWarning255, 214, 0
- GitLab Error RedError211, 47, 47
- GitLab BlueInfo31, 117, 203
Use GitLab's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
gitlab-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1F75CB;
--error: #D32F2F;
--accent: #E24329;
--border: #E5E5E5;
--primary: #FC6D26;
--success: #388E3C;
--surface: #F5F6FA;
--warning: #FFD600;
--secondary: #6B4FBB;
--text-muted: #9E9E9E;
--background: #FFFFFF;
--text-primary: #2E2E2E;
--text-secondary: #6B6B6B;
}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.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
5.3:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.9:1
Pass
Muted text on background
Needs 3:1 for large text
2.7:1
Fail
Muted text on surface
Needs 3:1 for large text
2.5:1
Fail
GitLab background, border and text colors
The quiet part of the GitLab palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- GitLab WhiteBackground
- HEX
- RGB
- HSL
- GitLab Surface GraySurface
- HEX
- RGB
- HSL
- GitLab Border GrayBorder
- HEX
- RGB
- HSL
- GitLab CharcoalText
- HEX
- RGB
- HSL
- GitLab Medium GraySecondary text
- HEX
- RGB
- HSL
- GitLab Light GrayMuted text
- HEX
- RGB
- HSL
About GitLab's colors
GitLab's palette is built around a vibrant orange primary, complemented by purple and red for brand distinction and a range of grays for UI clarity. The palette ensures accessibility and strong visual hierarchy.
Primary orange is paired with purple for contrast.
Grays are used for backgrounds and surfaces to maintain readability.
Accent red and blue provide semantic and visual highlights.
Psychology
The orange primary conveys energy, innovation, and approachability, while purple adds a sense of creativity and reliability. The supporting grays and semantic colors ensure clarity and trust.
Evolution
GitLab's core palette has remained stable, with orange and purple as signature colors since early brand iterations. Minor adjustments have been made to gray tones and semantic colors for better accessibility.
Where GitLab uses each color
- Primary
Used in the GitLab logo, primary buttons, and key highlights across the website.
- Secondary
Appears in navigation bars, secondary buttons, and backgrounds for emphasis.
- Accent
Used for alerts, badges, and call-to-action elements.
- Backgrounds
White and surface gray are used for main page backgrounds and content areas.
- Text
Charcoal and medium gray are applied to primary and secondary text for readability.
- Semantic
Green, yellow, red, and blue are used for status indicators, notifications, and messaging.
GitLab color questions
Hex codes, RGB values, neutrals and how to use the palette.
The GitLab primary color is GitLab Orange, with the hex code #FC6D26.
GitLab Orange (#FC6D26) is RGB(252, 109, 38) and CMYK(0, 57, 85, 1).
GitLab uses several grays: surface gray (#F5F6FA), border gray (#E5E5E5), charcoal (#2E2E2E), medium gray (#6B6B6B), and light gray (#9E9E9E) for UI and text.
Primary and secondary colors are reserved for branding and key UI elements, while grays and semantic colors are used for backgrounds, text, and status indicators. Always use the exact hex codes for consistency.
The secondary color is GitLab Purple, #6B4FBB, and the accent is GitLab Red, #E24329. 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 GitLab's colors consistently when it generates UI.
Make something in the spirit of GitLab
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.