Databricks color palette
TechDatabricks uses a bold, high-contrast palette anchored by its signature red-orange, paired with dark neutrals and subtle grays for a modern, technical look. The color system supports clarity and accessibility across its data analytics platform.
databricks.comDatabricks colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Databricks Red-OrangePrimary255, 54, 33
- Databricks Light RedSecondary255, 106, 77
- Databricks CoralAccent255, 191, 174
Surfaces
Page, cards and dividers.- Databricks CharcoalBackground26, 26, 26
- Databricks Surface GraySurface35, 35, 35
- Databricks Border GrayBorder57, 57, 57
Text
Three tiers of copy.- Databricks WhiteText255, 255, 255
- Databricks Light GraySecondary text194, 194, 194
- Databricks Muted GrayMuted text140, 140, 140
Semantic
Feedback and state colors.- Databricks GreenSuccess44, 182, 125
- Databricks AmberWarning255, 176, 32
- Databricks Error RedError225, 25, 0
- Databricks BlueInfo54, 148, 255
Use Databricks's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
databricks-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #3694FF;
--error: #E11900;
--accent: #FFBFAE;
--border: #393939;
--primary: #FF3621;
--success: #2CB67D;
--surface: #232323;
--warning: #FFB020;
--secondary: #FF6A4D;
--text-muted: #8C8C8C;
--background: #1A1A1A;
--text-primary: #FFFFFF;
--text-secondary: #C2C2C2;
}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.4:1
Pass
Text on surface
Needs 4.5:1 for body text
15.7:1
Pass
Secondary text on background
Needs 4.5:1 for body text
9.8:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
8.8:1
Pass
Muted text on background
Needs 3:1 for large text
5.2:1
Pass
Muted text on surface
Needs 3:1 for large text
4.7:1
Pass
Databricks gray, dark and neutral colors
Databricks 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.
- Databricks CharcoalBackground
- HEX
- RGB
- HSL
- Databricks Surface GraySurface
- HEX
- RGB
- HSL
- Databricks Border GrayBorder
- HEX
- RGB
- HSL
- Databricks WhiteText
- HEX
- RGB
- HSL
- Databricks Light GraySecondary text
- HEX
- RGB
- HSL
- Databricks Muted GrayMuted text
- HEX
- RGB
- HSL
About Databricks's colors
Databricks' palette is built around a vivid red-orange, contrasted with deep grays and white for clarity and accessibility. The supporting colors provide semantic cues and maintain a professional, technical feel.
Primary red-orange contrasts with dark backgrounds for high visibility.
Accent and secondary reds create visual hierarchy.
Semantic colors (green, amber, blue) support UI feedback.
Psychology
The red-orange primary signals energy, innovation, and urgency, aligning with Databricks' data-driven mission. Dark neutrals convey stability and focus, while semantic colors aid usability.
Evolution
The core palette has remained stable since Databricks' rebrand, with minor adjustments to accent and semantic tones for improved accessibility. The emphasis on dark UI backgrounds has increased in recent years.
Where Databricks uses each color
- Primary
Used for main action buttons, highlights, and the Databricks logo.
- Secondary
Appears in secondary buttons, hover states, and subtle UI accents.
- Accent
Used for backgrounds of badges, notifications, and illustrations.
- Backgrounds
Charcoal and surface grays are the foundation for app screens and dashboards.
- Text
White and light gray are used for primary and secondary text on dark backgrounds.
- Semantic
Green, amber, red, and blue are used for status indicators, alerts, and informational banners.
Databricks color questions
Hex codes, RGB values, neutrals and how to use the palette.
The Databricks primary color is #FF3621. This red-orange is used for key branding and UI elements.
The RGB for #FF3621 is (255, 54, 33). In CMYK, it is approximately (0, 79, 87, 0).
Databricks uses #1A1A1A (Charcoal), #232323 (Surface Gray), and #393939 (Border Gray) for backgrounds and UI structure. These dark neutrals provide contrast and support accessibility.
Use #FF3621 for primary actions and branding, with supporting reds and semantic colors for feedback. Dark grays form the UI foundation, and text should use white or light gray for readability.
The secondary color is Databricks Light Red, #FF6A4D, and the accent is Databricks Coral, #FFBFAE. 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 Databricks's colors consistently when it generates UI.
Make something in the spirit of Databricks
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.