#2A444F + #252F42 + #8DA62C + #9EB028 + #B8CF65 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#2A444F

Slate Blue · DarkSlateGray · Peacock Green

HEX

#2A444F

RGB

rgb(42, 68, 79)

HSL

hsl(198, 31%, 24%)

HSB

hsb(198, 47%, 31%)

CMYK

cmyk(47%, 14%, 0%, 69%)

Oklch

oklch(37.0% 0.037 226.6)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#252F42

Indigo · DarkSlateGray · Deep Sea Blue

HEX

#252F42

RGB

rgb(37, 47, 66)

HSL

hsl(219, 28%, 20%)

HSB

hsb(219, 44%, 26%)

CMYK

cmyk(44%, 29%, 0%, 74%)

Oklch

oklch(30.5% 0.037 262.9)

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

#8DA62C

Grass Green · Olive · Olive Green

HEX

#8DA62C

RGB

rgb(141, 166, 44)

HSL

hsl(72, 58%, 41%)

HSB

hsb(72, 73%, 65%)

CMYK

cmyk(15%, 0%, 73%, 35%)

Oklch

oklch(68.3% 0.146 120.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#9EB028

Autumn Sage · DarkGoldenRod · Honey Gold

HEX

#9EB028

RGB

rgb(158, 176, 40)

HSL

hsl(68, 63%, 42%)

HSB

hsb(68, 77%, 69%)

CMYK

cmyk(10%, 0%, 77%, 31%)

Oklch

oklch(71.9% 0.153 117.2)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#B8CF65

Grass Green · Tan · Olive Green

HEX

#B8CF65

RGB

rgb(184, 207, 101)

HSL

hsl(73, 52%, 60%)

HSB

hsb(73, 51%, 81%)

CMYK

cmyk(11%, 0%, 51%, 19%)

Oklch

oklch(81.5% 0.135 119.6)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A444F

50362A

Analogous

2A5049

2A444F

2A3250

Triadic

2A444F

502A45

45502A

Split-Comp.

2A444F

502A32

50492A

Tetradic

2A444F

492A50

50362A

32502A

Contrast Matrix WCAG 2.1 Contrast

2A444F	252F42	8DA62C	9EB028	B8CF65
—	1.3 Fail	3.7 AA Large	4.3 AA Large	6.0 AA
1.3 Fail	—	4.9 AA	5.6 AA	7.8 AAA
3.7 AA Large	4.9 AA	—	1.1 Fail	1.6 Fail
4.3 AA Large	5.6 AA	1.1 Fail	—	1.4 Fail
6.0 AA	7.8 AAA	1.6 Fail	1.4 Fail	—

White BG

10.3AAA

13.4AAA

2.8Fail

2.4Fail

1.7Fail

Black BG

2.0Fail

1.6Fail

7.6AAA

8.7AAA

12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

35354C

29293D

98984A

A6A649

C2C27F

Deuteranopia

34324C

29283C

969551

A5A351

C1BF85

Tritanopia

2B4A4A

263A39

8E6166

9F6369

B99397

Achromatopsia

3D3D3D

2E2E2E

919191

9B9B9B

BCBCBC

Shades & Tints Shades & Tints

#2A444F

Dark

Light

#252F42

Dark

Light

#8DA62C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a444f;
  --color-2: #252f42;
  --color-3: #8da62c;
  --color-4: #9eb028;
  --color-5: #b8cf65;
}

SCSS

$color-1: #2a444f;
$color-2: #252f42;
$color-3: #8da62c;
$color-4: #9eb028;
$color-5: #b8cf65;

TAILWIND

colors: {
  'brand-1': '#2a444f',
  'brand-2': '#252f42',
  'brand-3': '#8da62c',
  'brand-4': '#9eb028',
  'brand-5': '#b8cf65',
}

RGB Array

[42, 68, 79], [37, 47, 66], [141, 166, 44], [158, 176, 40], [184, 207, 101]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A444F, #252F42, #8DA62C, #9EB028, #B8CF65 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: #2a444f; --color-2: #252f42; --color-3: #8da62c; --color-4: #9eb028; --color-5: #b8cf65. 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