Salesforce color palette
TechSalesforce's color system is centered around a vibrant blue, complemented by soft neutrals and accent colors for clarity and approachability. The palette is designed for digital interfaces and reflects the brand's cloud-based identity.
salesforce.comSalesforce colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Salesforce BluePrimary0, 161, 224
- Salesforce Deep BlueSecondary0, 134, 191
- Salesforce GoldAccent255, 185, 0
Surfaces
Page, cards and dividers.- Salesforce Cloud GrayBackground244, 246, 249
- Salesforce WhiteSurface255, 255, 255
- Salesforce Light BorderBorder216, 223, 230
Text
Three tiers of copy.- Salesforce NavyText27, 38, 60
- Salesforce SlateSecondary text94, 106, 124
- Salesforce Muted GrayMuted text161, 170, 179
Semantic
Feedback and state colors.- Salesforce Success GreenSuccess46, 204, 113
- Salesforce Warning OrangeWarning245, 166, 35
- Salesforce Error RedError234, 0, 30
- Salesforce Info BlueInfo80, 191, 230
Use Salesforce's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
salesforce-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #50BFE6;
--error: #EA001E;
--accent: #FFB900;
--border: #D8DFE6;
--primary: #00A1E0;
--success: #2ECC71;
--surface: #FFFFFF;
--warning: #F5A623;
--secondary: #0086BF;
--text-muted: #A1AAB3;
--background: #F4F6F9;
--text-primary: #1B263C;
--text-secondary: #5E6A7C;
}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.0:1
Pass
Text on surface
Needs 4.5:1 for body text
15.1:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.1:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.5:1
Pass
Muted text on background
Needs 3:1 for large text
2.2:1
Fail
Muted text on surface
Needs 3:1 for large text
2.4:1
Fail
Salesforce background, border and text colors
The quiet part of the Salesforce palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Salesforce Cloud GrayBackground
- HEX
- RGB
- HSL
- Salesforce WhiteSurface
- HEX
- RGB
- HSL
- Salesforce Light BorderBorder
- HEX
- RGB
- HSL
- Salesforce NavyText
- HEX
- RGB
- HSL
- Salesforce SlateSecondary text
- HEX
- RGB
- HSL
- Salesforce Muted GrayMuted text
- HEX
- RGB
- HSL
About Salesforce's colors
Salesforce's palette is built on a foundation of blue, symbolizing trust and technology, with supporting neutrals and vibrant accents for clarity. The system is optimized for accessibility and digital readability.
Primary blue is paired with deep blue for hierarchy.
Neutrals provide balance and space for content.
Accent gold is used for highlights and calls to action.
Psychology
Blue conveys reliability, security, and professionalism, aligning with Salesforce's role as a trusted cloud platform. The use of soft grays and white supports a friendly, open feel.
Evolution
Salesforce's core blue has remained consistent since its early years, reinforcing brand recognition. The palette has gradually expanded to include more nuanced neutrals and accent colors for modern UI needs.
Where Salesforce uses each color
- Primary
Used in the Salesforce logo, main navigation, and primary action buttons.
- Secondary
Appears in navigation highlights, secondary buttons, and charts.
- Accent
Used for notifications, highlights, and important icons.
- Backgrounds
Cloud Gray is the main app and dashboard background; White is used for cards and content surfaces.
- Text
Navy is for primary text, Slate for secondary text, and Muted Gray for disabled or less important text.
- Semantic
Success Green, Warning Orange, Error Red, and Info Blue are used for status indicators and alerts.
Salesforce color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Salesforce primary color hex code is #00A1E0. This is known as Salesforce Blue.
Salesforce Blue (#00A1E0) in RGB is (0, 161, 224). For CMYK, it is approximately (100, 28, 0, 12).
Salesforce uses Cloud Gray (#F4F6F9) for backgrounds and Muted Gray (#A1AAB3) for subdued text and UI elements. These neutrals ensure clarity and accessibility in digital interfaces.
Primary and secondary blues are reserved for brand and key UI elements, while accent and semantic colors highlight actions and statuses. Neutrals and text colors provide structure and readability across all Salesforce products.
The secondary color is Salesforce Deep Blue, #0086BF, and the accent is Salesforce Gold, #FFB900. 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 Salesforce's colors consistently when it generates UI.
Make something in the spirit of Salesforce
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.