#D6E7AB + #9EDBAF + #72CCAA + #40B3AD + #6B646B · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D6E7AB

Willow Green · Wheat · Apple Green

HEX

#D6E7AB

RGB

rgb(214, 231, 171)

HSL

hsl(77, 56%, 79%)

HSB

hsb(77, 26%, 91%)

CMYK

cmyk(7%, 0%, 26%, 9%)

Oklch

oklch(90.1% 0.081 120.9)

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

#9EDBAF

Celadon · LightGreen · Apple Green

HEX

#9EDBAF

RGB

rgb(158, 219, 175)

HSL

hsl(137, 46%, 74%)

HSB

hsb(137, 28%, 86%)

CMYK

cmyk(28%, 0%, 20%, 14%)

Oklch

oklch(83.8% 0.087 152.9)

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

#72CCAA

Jade · MediumAquaMarine · Apple Green

HEX

#72CCAA

RGB

rgb(114, 204, 170)

HSL

hsl(157, 47%, 62%)

HSB

hsb(157, 44%, 80%)

CMYK

cmyk(44%, 0%, 17%, 20%)

Oklch

oklch(77.9% 0.101 167.3)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#40B3AD

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#40B3AD

RGB

rgb(64, 179, 173)

HSL

hsl(177, 47%, 48%)

HSB

hsb(177, 64%, 70%)

CMYK

cmyk(64%, 0%, 3%, 30%)

Oklch

oklch(70.1% 0.102 190.2)

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

#6B646B

Ink Gray · DimGray · Warm Gray

HEX

#6B646B

RGB

rgb(107, 100, 107)

HSL

hsl(300, 3%, 41%)

HSB

hsb(300, 7%, 42%)

CMYK

cmyk(0%, 7%, 0%, 58%)

Oklch

oklch(51.2% 0.014 325.8)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6E7AB

BCABE7

Analogous

E7DAAB

D6E7AB

B8E7AB

Triadic

D6E7AB

ABD6E7

E7ABD6

Split-Comp.

D6E7AB

ABB8E7

DAABE7

Tetradic

D6E7AB

ABE7DA

BCABE7

E7ABB8

Contrast Matrix WCAG 2.1 Contrast

D6E7AB	9EDBAF	72CCAA	40B3AD	6B646B
—	1.2 Fail	1.5 Fail	1.9 Fail	4.3 AA Large
1.2 Fail	—	1.2 Fail	1.6 Fail	3.6 AA Large
1.5 Fail	1.2 Fail	—	1.3 Fail	3.0 Fail
1.9 Fail	1.6 Fail	1.3 Fail	—	2.3 Fail
4.3 AA Large	3.6 AA Large	3.0 Fail	2.3 Fail	—

White BG

1.3Fail

1.6Fail

1.9Fail

2.5Fail

5.7AA

Black BG

15.9AAA

13.2AAA

10.9AAA

8.3AAA

3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDEBA

B8B9BA

999AB2

7273AE

686869

Deuteranopia

DCDBBD

B5B0BC

948DB4

6B63AF

686969

Tritanopia

D7C5C8

A1C2C4

77B9BA

46B0B0

6B6868

Achromatopsia

DBDBDB

C4C4C4

ADADAD

909090

676767

Shades & Tints Shades & Tints

#D6E7AB

Dark

Light

#9EDBAF

Dark

Light

#72CCAA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6e7ab;
  --color-2: #9edbaf;
  --color-3: #72ccaa;
  --color-4: #40b3ad;
  --color-5: #6b646b;
}

SCSS

$color-1: #d6e7ab;
$color-2: #9edbaf;
$color-3: #72ccaa;
$color-4: #40b3ad;
$color-5: #6b646b;

TAILWIND

colors: {
  'brand-1': '#d6e7ab',
  'brand-2': '#9edbaf',
  'brand-3': '#72ccaa',
  'brand-4': '#40b3ad',
  'brand-5': '#6b646b',
}

RGB Array

[214, 231, 171], [158, 219, 175], [114, 204, 170], [64, 179, 173], [107, 100, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #D6E7AB, #9EDBAF, #72CCAA, #40B3AD, #6B646B 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: #d6e7ab; --color-2: #9edbaf; --color-3: #72ccaa; --color-4: #40b3ad; --color-5: #6b646b. 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 sea-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