New Relic color palette
SaaSNew Relic's color system centers around a vibrant green paired with deep neutrals and subtle accent hues, reflecting its focus on clarity and modern SaaS interfaces. The palette is designed for high contrast and accessibility across dashboards and digital products.
newrelic.comNew Relic colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- New Relic GreenPrimary28, 231, 131
- New Relic NavySecondary12, 34, 63
- New Relic BlueAccent0, 145, 255
Surfaces
Page, cards and dividers.- New Relic Light GrayBackground246, 248, 250
- New Relic WhiteSurface255, 255, 255
- New Relic Border GrayBorder209, 213, 219
Text
Three tiers of copy.- New Relic CharcoalText26, 34, 51
- New Relic SlateSecondary text75, 88, 113
- New Relic Muted GrayMuted text123, 135, 148
Semantic
Feedback and state colors.- New Relic Success GreenSuccess28, 231, 131
- New Relic Warning YellowWarning255, 194, 71
- New Relic Error RedError255, 79, 94
- New Relic Info BlueInfo0, 145, 255
Use New Relic's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
new-relic-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0091FF;
--error: #FF4F5E;
--accent: #0091FF;
--border: #D1D5DB;
--primary: #1CE783;
--success: #1CE783;
--surface: #FFFFFF;
--warning: #FFC247;
--secondary: #0C223F;
--text-muted: #7B8794;
--background: #F6F8FA;
--text-primary: #1A2233;
--text-secondary: #4B5871;
}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.9: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
6.7:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.2:1
Pass
Muted text on background
Needs 3:1 for large text
3.4:1
Pass
Muted text on surface
Needs 3:1 for large text
3.7:1
Pass
New Relic background, border and text colors
The quiet part of the New Relic palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- New Relic Light GrayBackground
- HEX
- RGB
- HSL
- New Relic WhiteSurface
- HEX
- RGB
- HSL
- New Relic Border GrayBorder
- HEX
- RGB
- HSL
- New Relic CharcoalText
- HEX
- RGB
- HSL
- New Relic SlateSecondary text
- HEX
- RGB
- HSL
- New Relic Muted GrayMuted text
- HEX
- RGB
- HSL
About New Relic's colors
New Relic's palette uses a bold green as its anchor, balanced by deep blues and neutral grays for clarity and accessibility. The system is designed for digital interfaces, ensuring high contrast and legibility.
Primary green contrasts with navy and white for visual hierarchy.
Accent blue provides emphasis for interactive elements.
Neutral grays support backgrounds, surfaces, and borders.
Psychology
The primary green conveys growth, innovation, and reliability, while navy and slate tones add professionalism and trust. Accent blue signals action and draws attention to key UI elements.
Evolution
New Relic's palette has remained consistent, with minor adjustments to green and blue tones for digital accessibility. The neutral system has been refined for improved contrast and readability in modern UIs.
Where New Relic uses each color
- Primary
Used for main action buttons, highlights, and key brand moments across the website and product UI.
- Secondary
Appears in navigation bars, headers, and backgrounds for depth.
- Accent
Used for links, icons, and interactive states to draw attention.
- Backgrounds
Light gray and white backgrounds are standard in dashboards, cards, and app screens.
- Text
Charcoal and slate are used for primary and secondary text throughout the interface.
- Semantic
Success, warning, error, and info colors are used for status indicators, alerts, and notifications.
New Relic color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official New Relic primary color is #1CE783, known as New Relic Green. This color is used for branding and key actions.
The RGB value for #1CE783 is (28, 231, 131). For print, the approximate CMYK is (88, 0, 43, 9).
New Relic uses #F6F8FA (Light Gray), #D1D5DB (Border Gray), #1A2233 (Charcoal), and #7B8794 (Muted Gray) for backgrounds, borders, and text. These ensure clarity and accessibility in the UI.
Use New Relic Green (#1CE783) for primary actions and highlights, navy and blue for navigation and accents, and neutrals for backgrounds and text. Always maintain sufficient contrast for accessibility.
The secondary color is New Relic Navy, #0C223F, and the accent is New Relic Blue, #0091FF. 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 New Relic's colors consistently when it generates UI.
Make something in the spirit of New Relic
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.