Arc Browser color palette
TechArc Browser uses a vibrant blue and a range of deep, modern neutrals to create a distinct, contemporary tech identity. Its palette is designed for clarity and contrast within a dark UI environment.
arc.netArc Browser colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Arc BluePrimary79, 140, 255
- Arc CharcoalSecondary26, 26, 26
- Arc YellowAccent255, 216, 77
Surfaces
Page, cards and dividers.- Arc NightBackground24, 24, 27
- Arc SurfaceSurface35, 35, 43
- Arc BorderBorder45, 45, 54
Text
Three tiers of copy.- Arc WhiteText255, 255, 255
- Arc GraySecondary text179, 179, 188
- Arc MutedMuted text108, 108, 122
Semantic
Feedback and state colors.- Arc GreenSuccess63, 232, 122
- Arc YellowWarning255, 216, 77
- Arc RedError255, 92, 92
- Arc BlueInfo79, 140, 255
Use Arc Browser's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
arc-browser-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #4F8CFF;
--error: #FF5C5C;
--accent: #FFD84D;
--border: #2D2D36;
--primary: #4F8CFF;
--success: #3FE87A;
--surface: #23232B;
--warning: #FFD84D;
--secondary: #1A1A1A;
--text-muted: #6C6C7A;
--background: #18181B;
--text-primary: #FFFFFF;
--text-secondary: #B3B3BC;
}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.7:1
Pass
Text on surface
Needs 4.5:1 for body text
15.6:1
Pass
Secondary text on background
Needs 4.5:1 for body text
8.5:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
7.5: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.0:1
Pass
Arc Browser gray, dark and neutral colors
Arc Browser 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.
- Arc NightBackground
- HEX
- RGB
- HSL
- Arc SurfaceSurface
- HEX
- RGB
- HSL
- Arc BorderBorder
- HEX
- RGB
- HSL
- Arc WhiteText
- HEX
- RGB
- HSL
- Arc GraySecondary text
- HEX
- RGB
- HSL
- Arc MutedMuted text
- HEX
- RGB
- HSL
About Arc Browser's colors
Arc Browser's palette is built around a luminous blue, contrasted by deep, neutral backgrounds and subtle accent colors. The system is optimized for readability and a modern, focused interface.
Primary blue is used for highlights and active states.
Dark neutrals form the UI background and surfaces.
Yellow and green accents signal status and interactivity.
Psychology
The blue conveys trust, clarity, and innovation, while the dark neutrals evoke focus and sophistication. Accents like yellow and green provide energy and clear feedback.
Evolution
Arc's palette has remained consistent since launch, emphasizing its signature blue and dark UI. Minor adjustments have been made to accent colors for accessibility and contrast.
Where Arc Browser uses each color
- Primary
Used for active elements, highlights, and the main logo.
- Secondary
Forms the base of the sidebar, nav, and modal backgrounds.
- Accent
Appears in notifications, badges, and status indicators.
- Backgrounds
Applied to the main app background and overlays.
- Text
White and gray tones are used for headings, body text, and muted labels.
- Semantic
Green, yellow, and red are used for success, warning, and error states respectively.
Arc Browser color questions
Hex codes, RGB values, neutrals and how to use the palette.
The primary Arc Browser brand color is #4F8CFF, known as Arc Blue. This is used for highlights and branding.
Arc Blue (#4F8CFF) in RGB is (79, 140, 255). For CMYK, it is approximately (69, 45, 0, 0).
Arc Browser uses #1A1A1A (Arc Charcoal), #18181B (Arc Night), and #23232B (Arc Surface) as its primary dark and neutral UI backgrounds. These provide strong contrast with text and interactive elements.
Use Arc Blue (#4F8CFF) for primary actions and highlights, with dark neutrals as backgrounds. Accents like Arc Yellow (#FFD84D) and Arc Green (#3FE87A) are reserved for status and feedback.
The secondary color is Arc Charcoal, #1A1A1A, and the accent is Arc Yellow, #FFD84D. 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 Arc Browser's colors consistently when it generates UI.
Make something in the spirit of Arc Browser
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.