#2FB8D8 + #6BCDC3 + #A2D1C0 + #C3D2B6 + #D2DAC0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#2FB8D8

Lake Blue · MediumTurquoise · Lake Green

HEX

#2FB8D8

RGB

rgb(47, 184, 216)

HSL

hsl(191, 68%, 52%)

HSB

hsb(191, 78%, 85%)

CMYK

cmyk(78%, 15%, 0%, 15%)

Oklch

oklch(72.6% 0.120 217.9)

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

#6BCDC3

Jade · MediumAquaMarine · Lake Green

HEX

#6BCDC3

RGB

rgb(107, 205, 195)

HSL

hsl(174, 49%, 61%)

HSB

hsb(174, 48%, 80%)

CMYK

cmyk(48%, 0%, 5%, 20%)

Oklch

oklch(78.6% 0.094 186.8)

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

#A2D1C0

Jade · Silver · Apple Green

HEX

#A2D1C0

RGB

rgb(162, 209, 192)

HSL

hsl(158, 34%, 73%)

HSB

hsb(158, 22%, 82%)

CMYK

cmyk(22%, 0%, 8%, 18%)

Oklch

oklch(82.3% 0.055 170.8)

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

#C3D2B6

Celadon · Silver · Apple Green

HEX

#C3D2B6

RGB

rgb(195, 210, 182)

HSL

hsl(92, 24%, 77%)

HSB

hsb(92, 13%, 82%)

CMYK

cmyk(7%, 0%, 13%, 18%)

Oklch

oklch(84.5% 0.041 130.4)

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

#D2DAC0

Willow Green · LightGray · Apple Green

HEX

#D2DAC0

RGB

rgb(210, 218, 192)

HSL

hsl(78, 26%, 80%)

HSB

hsb(78, 12%, 85%)

CMYK

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

Oklch

oklch(87.5% 0.036 121.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2FB8D8

D85031

Analogous

31D8A3

2FB8D8

3166D8

Triadic

2FB8D8

D831B9

B9D831

Split-Comp.

2FB8D8

D83166

D8A331

Tetradic

2FB8D8

A331D8

D85031

66D831

Contrast Matrix WCAG 2.1 Contrast

2FB8D8	6BCDC3	A2D1C0	C3D2B6	D2DAC0
—	1.2 Fail	1.4 Fail	1.5 Fail	1.6 Fail
1.2 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.4 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.5 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.6 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

2.3Fail

1.9Fail

1.7Fail

1.6Fail

1.4Fail

Black BG

9.0AAA

11.1AAA

12.4AAA

13.2AAA

14.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6A6CD0

9596C5

B6B7C4

C9CABD

D5D6C6

Deuteranopia

6258CE

9088C6

B4B0C5

C9C8BE

D5D4C8

Tritanopia

36CAC9

70C7C8

A4C7C8

C4C2C3

D2CBCC

Achromatopsia

939393

AFAFAF

C1C1C1

CACACA

D5D5D5

Shades & Tints Shades & Tints

#2FB8D8

Dark

Light

#6BCDC3

Dark

Light

#A2D1C0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2fb8d8;
  --color-2: #6bcdc3;
  --color-3: #a2d1c0;
  --color-4: #c3d2b6;
  --color-5: #d2dac0;
}

SCSS

$color-1: #2fb8d8;
$color-2: #6bcdc3;
$color-3: #a2d1c0;
$color-4: #c3d2b6;
$color-5: #d2dac0;

TAILWIND

colors: {
  'brand-1': '#2fb8d8',
  'brand-2': '#6bcdc3',
  'brand-3': '#a2d1c0',
  'brand-4': '#c3d2b6',
  'brand-5': '#d2dac0',
}

RGB Array

[47, 184, 216], [107, 205, 195], [162, 209, 192], [195, 210, 182], [210, 218, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2FB8D8, #6BCDC3, #A2D1C0, #C3D2B6, #D2DAC0 is ideal for: health products, baby brands, fresh-style blogs. 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: #2fb8d8; --color-2: #6bcdc3; --color-3: #a2d1c0; --color-4: #c3d2b6; --color-5: #d2dac0. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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