← Back to Editor

#617B72 · #6F8E8D · #9DBA95 · #CDDE95 · #CED483

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#617B72

Mineral Blue · DimGray · Olive Green

HEX
#617B72
RGB
rgb(97, 123, 114)
HSL
hsl(159, 12%, 43%)
HSB
hsb(159, 21%, 48%)
CMYK
cmyk(21%, 0%, 7%, 52%)
Oklch
oklch(56.0% 0.033 171.9)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#6F8E8D

Mineral Blue · SlateGray · Mint Ice

HEX
#6F8E8D
RGB
rgb(111, 142, 141)
HSL
hsl(178, 12%, 50%)
HSB
hsb(178, 22%, 56%)
CMYK
cmyk(22%, 0%, 1%, 44%)
Oklch
oklch(62.3% 0.035 193.8)

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

#9DBA95

Celadon · DarkSeaGreen · Apple Green

HEX
#9DBA95
RGB
rgb(157, 186, 149)
HSL
hsl(107, 21%, 66%)
HSB
hsb(107, 20%, 73%)
CMYK
cmyk(16%, 0%, 20%, 27%)
Oklch
oklch(75.7% 0.061 138.9)

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

#CDDE95

Willow Green · Khaki · Apple Green

HEX
#CDDE95
RGB
rgb(205, 222, 149)
HSL
hsl(74, 53%, 73%)
HSB
hsb(74, 33%, 87%)
CMYK
cmyk(8%, 0%, 33%, 13%)
Oklch
oklch(87.1% 0.097 119.1)

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

#CED483

Fresh Green · BurlyWood · Sunflower

HEX
#CED483
RGB
rgb(206, 212, 131)
HSL
hsl(64, 49%, 67%)
HSB
hsb(64, 38%, 83%)
CMYK
cmyk(3%, 0%, 38%, 17%)
Oklch
oklch(84.7% 0.104 112.0)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

617B72
7B606A

Analogous

607B64
617B72
60777B

Triadic

617B72
72607B
7B7260

Split-Comp.

617B72
7B6077
7B6460

Tetradic

617B72
64607B
7B606A
777B60

Contrast Matrix WCAG 2.1 Contrast

617B72
6F8E8D
9DBA95
CDDE95
CED483
—
1.3
Fail
2.2
Fail
3.2
AA Large
2.9
Fail
1.3
Fail
—
1.7
Fail
2.4
Fail
2.3
Fail
2.2
Fail
1.7
Fail
—
1.5
Fail
1.4
Fail
3.2
AA Large
2.4
Fail
1.5
Fail
—
1.1
Fail
2.9
Fail
2.3
Fail
1.4
Fail
1.1
Fail
—
White BG
4.6AA
3.5AA Large
2.1Fail
1.5Fail
1.6Fail
Black BG
4.6AA
5.9AA
9.9AAA
14.5AAA
13.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6C6C74
7C7D8D
AAAA9E
D4D5A7
D1D197

Deuteranopia

6B6975
7B788D
A8A6A0
D3D2AB
D0D09B

Tritanopia

627676
718D8D
9EA5A7
CEB5B8
CEA6A9

Achromatopsia

727272
858585
ADADAD
D1D1D1
C9C9C9

Shades & Tints Shades & Tints

#617B72

Dark
Light

#6F8E8D

Dark
Light

#9DBA95

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #617b72;
  --color-2: #6f8e8d;
  --color-3: #9dba95;
  --color-4: #cdde95;
  --color-5: #ced483;
}

SCSS

$color-1: #617b72;
$color-2: #6f8e8d;
$color-3: #9dba95;
$color-4: #cdde95;
$color-5: #ced483;

TAILWIND

colors: {
  'brand-1': '#617b72',
  'brand-2': '#6f8e8d',
  'brand-3': '#9dba95',
  'brand-4': '#cdde95',
  'brand-5': '#ced483',
}

RGB Array

[97, 123, 114], [111, 142, 141], [157, 186, 149], [205, 222, 149], [206, 212, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #617B72, #6F8E8D, #9DBA95, #CDDE95, #CED483 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #617b72; --color-2: #6f8e8d; --color-3: #9dba95; --color-4: #cdde95; --color-5: #ced483. 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. Restrained colors convey professionalism and trust. 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