← Back to Editor

#000092 · #A7A9AC · #F1F2F3 · #FBFAFF

A 4-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#000092

Deep Indigo · Navy · Prussian Blue

HEX
#000092
RGB
rgb(0, 0, 146)
HSL
hsl(240, 100%, 29%)
HSB
hsb(240, 100%, 57%)
CMYK
cmyk(100%, 100%, 0%, 43%)
Oklch
oklch(29.8% 0.207 264.1)

TraditionalDeep Indigo」· PaintPrussian Blue」· Creative Blush Sunrise

#A7A9AC

Ash · DarkGray · Silver Sand

HEX
#A7A9AC
RGB
rgb(167, 169, 172)
HSL
hsl(216, 3%, 66%)
HSB
hsb(216, 3%, 67%)
CMYK
cmyk(3%, 2%, 0%, 33%)
Oklch
oklch(73.4% 0.005 258.3)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#F1F2F3

Azure · SeaShell · Cloud White

HEX
#F1F2F3
RGB
rgb(241, 242, 243)
HSL
hsl(210, 8%, 95%)
HSB
hsb(210, 1%, 95%)
CMYK
cmyk(1%, 0%, 0%, 5%)
Oklch
oklch(96.1% 0.002 247.8)

TraditionalAzure」· PaintCloud White」· Creative Morning Mist

#FBFAFF

Wisteria · White · Sky Blue

HEX
#FBFAFF
RGB
rgb(251, 250, 255)
HSL
hsl(252, 100%, 99%)
HSB
hsb(252, 2%, 100%)
CMYK
cmyk(2%, 2%, 0%, 0%)
Oklch
oklch(98.7% 0.007 295.5)

TraditionalWisteria」· PaintSky Blue」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

000092
949400

Analogous

004A94
000092
4A0094

Triadic

000092
940000
009400

Split-Comp.

000092
944A00
4A9400

Tetradic

000092
94004A
949400
00944A

Contrast Matrix WCAG 2.1 Contrast

000092
A7A9AC
F1F2F3
FBFAFF
6.3
AA
13.2
AAA
14.3
AAA
6.3
AA
2.1
Fail
2.3
Fail
13.2
AAA
2.1
Fail
1.1
Fail
14.3
AAA
2.3
Fail
1.1
Fail
White BG
14.8AAA
2.4Fail
1.1Fail
1.0Fail
Black BG
1.4Fail
8.9AAA
18.7AAA
20.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

00006F
A8A8AB
F1F1F3
FBFBFE

Deuteranopia

000066
A8A8AB
F1F1F3
FBFBFE

Tritanopia

00534D
A7ABAB
F1F3F3
FBFDFD

Achromatopsia

111111
A9A9A9
F2F2F2
FBFBFB

Shades & Tints Shades & Tints

#000092

Dark
Light

#A7A9AC

Dark
Light

#F1F2F3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #000092;
  --color-2: #a7a9ac;
  --color-3: #f1f2f3;
  --color-4: #fbfaff;
}

SCSS

$color-1: #000092;
$color-2: #a7a9ac;
$color-3: #f1f2f3;
$color-4: #fbfaff;

TAILWIND

colors: {
  'brand-1': '#000092',
  'brand-2': '#a7a9ac',
  'brand-3': '#f1f2f3',
  'brand-4': '#fbfaff',
}

RGB Array

[0, 0, 146], [167, 169, 172], [241, 242, 243], [251, 250, 255]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This general-style palette of #000092, #A7A9AC, #F1F2F3, #FBFAFF is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #000092; --color-2: #a7a9ac; --color-3: #f1f2f3; --color-4: #fbfaff. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. High-contrast palettes naturally meet WCAG accessibility standards. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 4-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color