← Back to Editor

#608075 · #97B282 · #BBC276 · #DBDC75 · #E4E094

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#608075

Mineral Blue · DimGray · Olive Green

HEX
#608075
RGB
rgb(96, 128, 117)
HSL
hsl(159, 14%, 44%)
HSB
hsb(159, 25%, 50%)
CMYK
cmyk(25%, 0%, 9%, 50%)
Oklch
oklch(57.2% 0.040 171.7)

TraditionalMineral Blue」· PaintOlive Green」· Creative Blush Sunrise

#97B282

Celadon · DarkSeaGreen · Olive Green

HEX
#97B282
RGB
rgb(151, 178, 130)
HSL
hsl(94, 24%, 60%)
HSB
hsb(94, 27%, 70%)
CMYK
cmyk(15%, 0%, 27%, 30%)
Oklch
oklch(73.1% 0.073 131.9)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#BBC276

Fresh Green · Tan · Sunflower

HEX
#BBC276
RGB
rgb(187, 194, 118)
HSL
hsl(66, 38%, 61%)
HSB
hsb(66, 39%, 76%)
CMYK
cmyk(4%, 0%, 39%, 24%)
Oklch
oklch(79.1% 0.099 113.0)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#DBDC75

Fresh Green · Khaki · Sunflower

HEX
#DBDC75
RGB
rgb(219, 220, 117)
HSL
hsl(61, 60%, 66%)
HSB
hsb(61, 47%, 86%)
CMYK
cmyk(0%, 0%, 47%, 14%)
Oklch
oklch(87.2% 0.126 109.3)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#E4E094

Fresh Green · Khaki · Sunflower

HEX
#E4E094
RGB
rgb(228, 224, 148)
HSL
hsl(57, 60%, 74%)
HSB
hsb(57, 35%, 89%)
CMYK
cmyk(0%, 2%, 35%, 11%)
Oklch
oklch(89.3% 0.097 105.6)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

608075
80606B

Analogous

608065
608075
607B80

Triadic

608075
756080
807560

Split-Comp.

608075
80607B
806560

Tetradic

608075
656080
80606B
7B8060

Contrast Matrix WCAG 2.1 Contrast

608075
97B282
BBC276
DBDC75
E4E094
1.9
Fail
2.3
Fail
3.0
Fail
3.2
AA Large
1.9
Fail
1.2
Fail
1.6
Fail
1.7
Fail
2.3
Fail
1.2
Fail
1.3
Fail
1.4
Fail
3.0
Fail
1.6
Fail
1.3
Fail
1.1
Fail
3.2
AA Large
1.7
Fail
1.4
Fail
1.1
Fail
White BG
4.3AA Large
2.3Fail
1.9Fail
1.4Fail
1.4Fail
Black BG
4.8AA
9.0AAA
11.1AAA
14.5AAA
15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6E6E78
A3A38E
BEBE88
DBDB8E
E2E2A6

Deuteranopia

6C6A78
A19F90
BEBD8D
DBDB94
E3E3AB

Tritanopia

627A7A
989799
BB979A
DBA2A6
E4B5B8

Achromatopsia

757575
A4A4A4
B7B7B7
D0D0D0
D9D9D9

Shades & Tints Shades & Tints

#608075

Dark
Light

#97B282

Dark
Light

#BBC276

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #608075;
  --color-2: #97b282;
  --color-3: #bbc276;
  --color-4: #dbdc75;
  --color-5: #e4e094;
}

SCSS

$color-1: #608075;
$color-2: #97b282;
$color-3: #bbc276;
$color-4: #dbdc75;
$color-5: #e4e094;

TAILWIND

colors: {
  'brand-1': '#608075',
  'brand-2': '#97b282',
  'brand-3': '#bbc276',
  'brand-4': '#dbdc75',
  'brand-5': '#e4e094',
}

RGB Array

[96, 128, 117], [151, 178, 130], [187, 194, 118], [219, 220, 117], [228, 224, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #608075, #97B282, #BBC276, #DBDC75, #E4E094 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: #608075; --color-2: #97b282; --color-3: #bbc276; --color-4: #dbdc75; --color-5: #e4e094. 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