#23565B + #2F676C + #8EB640 + #A8D256 + #B7E068 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#23565B

Slate Blue · DarkSlateGray · Peacock Green

HEX

#23565B

RGB

rgb(35, 86, 91)

HSL

hsl(185, 44%, 25%)

HSB

hsb(185, 62%, 36%)

CMYK

cmyk(62%, 5%, 0%, 64%)

Oklch

oklch(42.1% 0.055 204.0)

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

#2F676C

Slate Blue · DarkSlateGray · Mint Ice

HEX

#2F676C

RGB

rgb(47, 103, 108)

HSL

hsl(185, 39%, 30%)

HSB

hsb(185, 56%, 42%)

CMYK

cmyk(56%, 5%, 0%, 58%)

Oklch

oklch(47.8% 0.059 203.2)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8EB640

Grass Green · DarkSeaGreen · Olive Green

HEX

#8EB640

RGB

rgb(142, 182, 64)

HSL

hsl(80, 48%, 48%)

HSB

hsb(80, 65%, 71%)

CMYK

cmyk(22%, 0%, 65%, 29%)

Oklch

oklch(72.4% 0.152 126.0)

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

#A8D256

Grass Green · GreenYellow · Olive Green

HEX

#A8D256

RGB

rgb(168, 210, 86)

HSL

hsl(80, 58%, 58%)

HSB

hsb(80, 59%, 82%)

CMYK

cmyk(20%, 0%, 59%, 18%)

Oklch

oklch(80.9% 0.159 125.5)

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

#B7E068

Willow Green · LightGreen · Apple Green

HEX

#B7E068

RGB

rgb(183, 224, 104)

HSL

hsl(81, 66%, 64%)

HSB

hsb(81, 54%, 88%)

CMYK

cmyk(18%, 0%, 54%, 12%)

Oklch

oklch(85.3% 0.155 125.2)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

23565B

5C2824

Analogous

245C44

23565B

243B5C

Triadic

23565B

5C2457

575C24

Split-Comp.

23565B

5C243B

5C4424

Tetradic

23565B

44245C

5C2824

3B5C24

Contrast Matrix WCAG 2.1 Contrast

23565B	2F676C	8EB640	A8D256	B7E068
—	1.3 Fail	3.5 AA Large	4.7 AA	5.4 AA
1.3 Fail	—	2.7 Fail	3.7 AA Large	4.2 AA Large
3.5 AA Large	2.7 Fail	—	1.3 Fail	1.6 Fail
4.7 AA	3.7 AA Large	1.3 Fail	—	1.2 Fail
5.4 AA	4.2 AA Large	1.6 Fail	1.2 Fail	—

White BG

8.2AAA

6.4AA

2.4Fail

1.7Fail

1.5Fail

Black BG

2.6Fail

3.3AA Large

8.9AAA

12.0AAA

13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

393A5A

47486B

9FA05D

BABB74

C9C985

Deuteranopia

36325A

44406B

9D9A63

B8B57B

C6C38C

Tritanopia

265959

326A6A

907378

AA8C91

B99CA1

Achromatopsia

474747

575757

9D9D9D

B7B7B7

C6C6C6

Shades & Tints Shades & Tints

#23565B

Dark

Light

#2F676C

Dark

Light

#8EB640

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #23565b;
  --color-2: #2f676c;
  --color-3: #8eb640;
  --color-4: #a8d256;
  --color-5: #b7e068;
}

SCSS

$color-1: #23565b;
$color-2: #2f676c;
$color-3: #8eb640;
$color-4: #a8d256;
$color-5: #b7e068;

TAILWIND

colors: {
  'brand-1': '#23565b',
  'brand-2': '#2f676c',
  'brand-3': '#8eb640',
  'brand-4': '#a8d256',
  'brand-5': '#b7e068',
}

RGB Array

[35, 86, 91], [47, 103, 108], [142, 182, 64], [168, 210, 86], [183, 224, 104]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #23565B, #2F676C, #8EB640, #A8D256, #B7E068 is ideal for: corporate websites, product showcases, portfolios. 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: #23565b; --color-2: #2f676c; --color-3: #8eb640; --color-4: #a8d256; --color-5: #b7e068. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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