#7DCACB + #93D1B7 + #A8D8A5 + #BEE091 + #D4E77D - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7DCACB

Sky Blue · SkyBlue · Lake Green

HEX

#7DCACB

RGB

rgb(125, 202, 203)

HSL

hsl(181, 43%, 64%)

HSB

hsb(181, 38%, 80%)

CMYK

cmyk(38%, 0%, 0%, 20%)

Oklch

oklch(79.0% 0.076 196.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#93D1B7

Jade · DarkSeaGreen · Apple Green

HEX

#93D1B7

RGB

rgb(147, 209, 183)

HSL

hsl(155, 40%, 70%)

HSB

hsb(155, 30%, 82%)

CMYK

cmyk(30%, 0%, 12%, 18%)

Oklch

oklch(81.1% 0.073 166.6)

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

#A8D8A5

Celadon · LightGreen · Apple Green

HEX

#A8D8A5

RGB

rgb(168, 216, 165)

HSL

hsl(116, 40%, 75%)

HSB

hsb(116, 24%, 85%)

CMYK

cmyk(22%, 0%, 24%, 15%)

Oklch

oklch(83.5% 0.086 143.3)

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

#BEE091

Willow Green · LightGreen · Apple Green

HEX

#BEE091

RGB

rgb(190, 224, 145)

HSL

hsl(86, 56%, 72%)

HSB

hsb(86, 35%, 88%)

CMYK

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

Oklch

oklch(86.3% 0.110 127.5)

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

#D4E77D

Willow Green · Khaki · Apple Green

HEX

#D4E77D

RGB

rgb(212, 231, 125)

HSL

hsl(71, 69%, 70%)

HSB

hsb(71, 46%, 91%)

CMYK

cmyk(8%, 0%, 46%, 9%)

Oklch

oklch(89.1% 0.133 117.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7DCACB

CB7D7C

Analogous

7CCBA5

7DCACB

7CA2CB

Triadic

7DCACB

CB7CC9

C9CB7C

Split-Comp.

7DCACB

CB7CA2

CBA57C

Tetradic

7DCACB

A57CCB

CB7D7C

A2CB7C

Contrast Matrix WCAG 2.1 Contrast

7DCACB	93D1B7	A8D8A5	BEE091	D4E77D
—	1.1 Fail	1.2 Fail	1.3 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.3 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.4 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

1.9Fail

1.7Fail

1.6Fail

1.5Fail

1.4Fail

Black BG

11.2AAA

12.0AAA

13.0AAA

14.3AAA

15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9E9FCB

AEAEBD

BDBDB1

CDCDA4

DCDC97

Deuteranopia

9A94CB

AAA6BF

BAB6B4

CBC8A9

DBDA9D

Tritanopia

81CBCB

96C2C3

AABBBD

C0B3B7

D5ABAF

Achromatopsia

B3B3B3

BBBBBB

C4C4C4

CDCDCD

D5D5D5

Shades & Tints Shades & Tints

#7DCACB

Dark

Light

#93D1B7

Dark

Light

#A8D8A5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7dcacb;
  --color-2: #93d1b7;
  --color-3: #a8d8a5;
  --color-4: #bee091;
  --color-5: #d4e77d;
}

SCSS

$color-1: #7dcacb;
$color-2: #93d1b7;
$color-3: #a8d8a5;
$color-4: #bee091;
$color-5: #d4e77d;

TAILWIND

colors: {
  'brand-1': '#7dcacb',
  'brand-2': '#93d1b7',
  'brand-3': '#a8d8a5',
  'brand-4': '#bee091',
  'brand-5': '#d4e77d',
}

RGB Array

[125, 202, 203], [147, 209, 183], [168, 216, 165], [190, 224, 145], [212, 231, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7DCACB, #93D1B7, #A8D8A5, #BEE091, #D4E77D 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: #7dcacb; --color-2: #93d1b7; --color-3: #a8d8a5; --color-4: #bee091; --color-5: #d4e77d. 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