#092F53 + #203F54 + #374862 + #564F5F + #926770 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#092F53

Lake Blue · MidnightBlue · Deep Sea Blue

HEX

#092F53

RGB

rgb(9, 47, 83)

HSL

hsl(209, 80%, 18%)

HSB

hsb(209, 89%, 33%)

CMYK

cmyk(89%, 43%, 0%, 67%)

Oklch

oklch(30.1% 0.077 251.3)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#203F54

Slate Blue · DarkSlateGray · Prussian Blue

HEX

#203F54

RGB

rgb(32, 63, 84)

HSL

hsl(204, 45%, 23%)

HSB

hsb(204, 62%, 33%)

CMYK

cmyk(62%, 25%, 0%, 67%)

Oklch

oklch(35.4% 0.052 240.1)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#374862

Indigo · DarkSlateGray · Prussian Blue

HEX

#374862

RGB

rgb(55, 72, 98)

HSL

hsl(216, 28%, 30%)

HSB

hsb(216, 44%, 38%)

CMYK

cmyk(44%, 27%, 0%, 62%)

Oklch

oklch(39.9% 0.049 258.7)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#564F5F

Deep Indigo · DimGray · Charcoal

HEX

#564F5F

RGB

rgb(86, 79, 95)

HSL

hsl(266, 9%, 34%)

HSB

hsb(266, 17%, 37%)

CMYK

cmyk(9%, 17%, 0%, 63%)

Oklch

oklch(44.0% 0.027 305.1)

Traditional「Deep Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#926770

Crimson · Gray · Passion Red

HEX

#926770

RGB

rgb(146, 103, 112)

HSL

hsl(347, 17%, 49%)

HSB

hsb(347, 29%, 57%)

CMYK

cmyk(0%, 29%, 23%, 43%)

Oklch

oklch(56.1% 0.057 5.2)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

092F53

532D09

Analogous

095351

092F53

090A53

Triadic

092F53

53092F

2F5309

Split-Comp.

092F53

53090A

535109

Tetradic

092F53

510953

532D09

0A5309

Contrast Matrix WCAG 2.1 Contrast

092F53	203F54	374862	564F5F	926770
—	1.2 Fail	1.5 Fail	1.7 Fail	2.8 Fail
1.2 Fail	—	1.2 Fail	1.4 Fail	2.3 Fail
1.5 Fail	1.2 Fail	—	1.2 Fail	1.9 Fail
1.7 Fail	1.4 Fail	1.2 Fail	—	1.6 Fail
2.8 Fail	2.3 Fail	1.9 Fail	1.6 Fail	—

White BG

13.6AAA

11.1AAA

9.3AAA

7.8AAA

4.8AA

Black BG

1.5Fail

1.9Fail

2.3Fail

2.7Fail

4.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

191A4A

2D2E4F

3E3F5C

53535B

7F7F6E

Deuteranopia

171448

2C294E

3D3C5A

53545A

82856D

Tritanopia

0B4342

224B4A

385756

565857

906C6C

Achromatopsia

282828

383838

464646

535353

757575

Shades & Tints Shades & Tints

#092F53

Dark

Light

#203F54

Dark

Light

#374862

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #092f53;
  --color-2: #203f54;
  --color-3: #374862;
  --color-4: #564f5f;
  --color-5: #926770;
}

SCSS

$color-1: #092f53;
$color-2: #203f54;
$color-3: #374862;
$color-4: #564f5f;
$color-5: #926770;

TAILWIND

colors: {
  'brand-1': '#092f53',
  'brand-2': '#203f54',
  'brand-3': '#374862',
  'brand-4': '#564f5f',
  'brand-5': '#926770',
}

RGB Array

[9, 47, 83], [32, 63, 84], [55, 72, 98], [86, 79, 95], [146, 103, 112]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #092F53, #203F54, #374862, #564F5F, #926770 is ideal for: tech websites, dark mode UIs, game UIs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #092f53; --color-2: #203f54; --color-3: #374862; --color-4: #564f5f; --color-5: #926770. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 5-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