#9CD9BF + #65C9A8 + #0CBFB3 + #64929C + #61638C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#9CD9BF

Jade · LightSteelBlue · Apple Green

HEX

#9CD9BF

RGB

rgb(156, 217, 191)

HSL

hsl(154, 45%, 73%)

HSB

hsb(154, 28%, 85%)

CMYK

cmyk(28%, 0%, 12%, 15%)

Oklch

oklch(83.6% 0.072 166.4)

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

#65C9A8

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#65C9A8

RGB

rgb(101, 201, 168)

HSL

hsl(160, 48%, 59%)

HSB

hsb(160, 50%, 79%)

CMYK

cmyk(50%, 0%, 16%, 21%)

Oklch

oklch(76.6% 0.107 169.5)

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

#0CBFB3

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#0CBFB3

RGB

rgb(12, 191, 179)

HSL

hsl(176, 88%, 40%)

HSB

hsb(176, 94%, 75%)

CMYK

cmyk(94%, 0%, 6%, 25%)

Oklch

oklch(72.5% 0.125 186.8)

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

#64929C

Slate Blue · CadetBlue · Mint Ice

HEX

#64929C

RGB

rgb(100, 146, 156)

HSL

hsl(191, 22%, 50%)

HSB

hsb(191, 36%, 61%)

CMYK

cmyk(36%, 6%, 0%, 39%)

Oklch

oklch(63.1% 0.052 212.7)

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

#61638C

Indigo · SlateGray · Navy Blue

HEX

#61638C

RGB

rgb(97, 99, 140)

HSL

hsl(237, 18%, 46%)

HSB

hsb(237, 31%, 55%)

CMYK

cmyk(31%, 29%, 0%, 45%)

Oklch

oklch(51.5% 0.065 281.7)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9CD9BF

D99BB6

Analogous

9BD99F

9CD9BF

9BD5D9

Triadic

9CD9BF

BE9BD9

D9BE9B

Split-Comp.

9CD9BF

D99BD5

D99F9B

Tetradic

9CD9BF

9F9BD9

D99BB6

D5D99B

Contrast Matrix WCAG 2.1 Contrast

9CD9BF	65C9A8	0CBFB3	64929C	61638C
—	1.2 Fail	1.4 Fail	2.1 Fail	3.6 AA Large
1.2 Fail	—	1.1 Fail	1.7 Fail	2.9 Fail
1.4 Fail	1.1 Fail	—	1.5 Fail	2.5 Fail
2.1 Fail	1.7 Fail	1.5 Fail	—	1.7 Fail
3.6 AA Large	2.9 Fail	2.5 Fail	1.7 Fail	—

White BG

1.6Fail

2.0Fail

2.3Fail

3.4AA Large

5.7AA

Black BG

13.1AAA

10.5AAA

9.1AAA

6.1AA

3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B7C5

9091B0

5A5BB6

78789A

626282

Deuteranopia

B3AEC7

8B83B2

4F42B7

757299

626280

Tritanopia

9FCACB

6AB6B8

15B8B9

669897

617A79

Achromatopsia

C4C4C4

A7A7A7

888888

858585

676767

Shades & Tints Shades & Tints

#9CD9BF

Dark

Light

#65C9A8

Dark

Light

#0CBFB3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9cd9bf;
  --color-2: #65c9a8;
  --color-3: #0cbfb3;
  --color-4: #64929c;
  --color-5: #61638c;
}

SCSS

$color-1: #9cd9bf;
$color-2: #65c9a8;
$color-3: #0cbfb3;
$color-4: #64929c;
$color-5: #61638c;

TAILWIND

colors: {
  'brand-1': '#9cd9bf',
  'brand-2': '#65c9a8',
  'brand-3': '#0cbfb3',
  'brand-4': '#64929c',
  'brand-5': '#61638c',
}

RGB Array

[156, 217, 191], [101, 201, 168], [12, 191, 179], [100, 146, 156], [97, 99, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9CD9BF, #65C9A8, #0CBFB3, #64929C, #61638C 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: #9cd9bf; --color-2: #65c9a8; --color-3: #0cbfb3; --color-4: #64929c; --color-5: #61638c. 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