#7AFFD3 + #FBFFC7 + #E8E7BE + #ADC7BC + #A9B6BA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7AFFD3

Jade · SkyBlue · Lake Green

HEX

#7AFFD3

RGB

rgb(122, 255, 211)

HSL

hsl(160, 100%, 74%)

HSB

hsb(160, 52%, 100%)

CMYK

cmyk(52%, 0%, 17%, 0%)

Oklch

oklch(91.3% 0.134 169.0)

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

#FBFFC7

Fresh Green · Beige · Lemon Cream

HEX

#FBFFC7

RGB

rgb(251, 255, 199)

HSL

hsl(64, 100%, 89%)

HSB

hsb(64, 22%, 100%)

CMYK

cmyk(2%, 0%, 22%, 0%)

Oklch

oklch(98.3% 0.072 111.0)

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

#E8E7BE

Fresh Green · Wheat · Lemon Cream

HEX

#E8E7BE

RGB

rgb(232, 231, 190)

HSL

hsl(59, 48%, 83%)

HSB

hsb(59, 18%, 91%)

CMYK

cmyk(0%, 0%, 18%, 9%)

Oklch

oklch(91.8% 0.054 106.3)

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

#ADC7BC

Jade · Silver · Apple Green

HEX

#ADC7BC

RGB

rgb(173, 199, 188)

HSL

hsl(155, 19%, 73%)

HSB

hsb(155, 13%, 78%)

CMYK

cmyk(13%, 0%, 6%, 22%)

Oklch

oklch(80.7% 0.032 168.1)

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

#A9B6BA

Sky Blue · DarkGray · Lake Green

HEX

#A9B6BA

RGB

rgb(169, 182, 186)

HSL

hsl(194, 11%, 70%)

HSB

hsb(194, 9%, 73%)

CMYK

cmyk(9%, 2%, 0%, 27%)

Oklch

oklch(76.7% 0.016 218.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7AFFD3

FF7AA7

Analogous

7AFF90

7AFFD3

7AE9FF

Triadic

7AFFD3

D37AFF

FFD37A

Split-Comp.

7AFFD3

FF7AE9

FF917A

Tetradic

7AFFD3

917AFF

FF7AA7

E9FF7A

Contrast Matrix WCAG 2.1 Contrast

7AFFD3	FBFFC7	E8E7BE	ADC7BC	A9B6BA
—	1.2 Fail	1.0 Fail	1.5 Fail	1.7 Fail
1.2 Fail	—	1.2 Fail	1.7 Fail	2.0 Fail
1.0 Fail	1.2 Fail	—	1.4 Fail	1.6 Fail
1.5 Fail	1.7 Fail	1.4 Fail	—	1.2 Fail
1.7 Fail	2.0 Fail	1.6 Fail	1.2 Fail	—

White BG

1.2Fail

1.0Fail

1.3Fail

1.8Fail

2.1Fail

Black BG

17.1AAA

20.2AAA

16.6AAA

11.7AAA

10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B5DE

FDFDD5

E8E8C8

B8B8BF

AFAFB9

Deuteranopia

ACA2E0

FDFCD8

E8E8CA

B7B5BF

AEADB9

Tritanopia

81E6E8

FBDFE2

E8D0D1

AEC1C1

AAB8B8

Achromatopsia

D2D2D2

F7F7F7

E3E3E3

BEBEBE

B3B3B3

Shades & Tints Shades & Tints

#7AFFD3

Dark

Light

#FBFFC7

Dark

Light

#E8E7BE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7affd3;
  --color-2: #fbffc7;
  --color-3: #e8e7be;
  --color-4: #adc7bc;
  --color-5: #a9b6ba;
}

SCSS

$color-1: #7affd3;
$color-2: #fbffc7;
$color-3: #e8e7be;
$color-4: #adc7bc;
$color-5: #a9b6ba;

TAILWIND

colors: {
  'brand-1': '#7affd3',
  'brand-2': '#fbffc7',
  'brand-3': '#e8e7be',
  'brand-4': '#adc7bc',
  'brand-5': '#a9b6ba',
}

RGB Array

[122, 255, 211], [251, 255, 199], [232, 231, 190], [173, 199, 188], [169, 182, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7AFFD3, #FBFFC7, #E8E7BE, #ADC7BC, #A9B6BA 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: #7affd3; --color-2: #fbffc7; --color-3: #e8e7be; --color-4: #adc7bc; --color-5: #a9b6ba. 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