#7BA08F + #A4B49A + #E1BEA0 + #EEDAB5 + #F7F3CD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7BA08F

Mineral Blue · LightSlateGray · Olive Green

HEX

#7BA08F

RGB

rgb(123, 160, 143)

HSL

hsl(152, 16%, 55%)

HSB

hsb(152, 23%, 63%)

CMYK

cmyk(23%, 0%, 11%, 37%)

Oklch

oklch(67.3% 0.048 165.2)

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

#A4B49A

Celadon · DarkGray · Apple Green

HEX

#A4B49A

RGB

rgb(164, 180, 154)

HSL

hsl(97, 15%, 65%)

HSB

hsb(97, 14%, 71%)

CMYK

cmyk(9%, 0%, 14%, 29%)

Oklch

oklch(75.0% 0.041 133.3)

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

#E1BEA0

Apricot · BurlyWood · Warm Sun

HEX

#E1BEA0

RGB

rgb(225, 190, 160)

HSL

hsl(28, 52%, 75%)

HSB

hsb(28, 29%, 88%)

CMYK

cmyk(0%, 16%, 29%, 12%)

Oklch

oklch(82.4% 0.057 62.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#EEDAB5

Goose Yellow · Wheat · Peach Orange

HEX

#EEDAB5

RGB

rgb(238, 218, 181)

HSL

hsl(39, 63%, 82%)

HSB

hsb(39, 24%, 93%)

CMYK

cmyk(0%, 8%, 24%, 7%)

Oklch

oklch(89.5% 0.053 82.9)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F7F3CD

Fresh Green · Beige · Lemon Cream

HEX

#F7F3CD

RGB

rgb(247, 243, 205)

HSL

hsl(54, 72%, 89%)

HSB

hsb(54, 17%, 97%)

CMYK

cmyk(0%, 2%, 17%, 3%)

Oklch

oklch(95.8% 0.050 102.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7BA08F

9F7A8B

Analogous

7A9F7B

7BA08F

7A9D9F

Triadic

7BA08F

8D7A9F

9F8D7A

Split-Comp.

7BA08F

9F7A9D

9F7B7A

Tetradic

7BA08F

7B7A9F

9F7A8B

9D9F7A

Contrast Matrix WCAG 2.1 Contrast

7BA08F	A4B49A	E1BEA0	EEDAB5	F7F3CD
—	1.3 Fail	1.7 Fail	2.1 Fail	2.6 Fail
1.3 Fail	—	1.3 Fail	1.6 Fail	1.9 Fail
1.7 Fail	1.3 Fail	—	1.3 Fail	1.5 Fail
2.1 Fail	1.6 Fail	1.3 Fail	—	1.2 Fail
2.6 Fail	1.9 Fail	1.5 Fail	1.2 Fail	—

White BG

2.9Fail

2.2Fail

1.7Fail

1.4Fail

1.1Fail

Black BG

7.3AAA

9.6AAA

12.1AAA

15.3AAA

18.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8B8B93

ABABA0

D2D2A7

E5E5BE

F5F5D6

Deuteranopia

898694

AAA9A2

D4D7A9

E7E8C0

F6F6D8

Tritanopia

7D9697

A5A5A6

DFADAE

EDC5C7

F7DDDF

Achromatopsia

939393

ACACAC

C5C5C5

DCDCDC

F0F0F0

Shades & Tints Shades & Tints

#7BA08F

Dark

Light

#A4B49A

Dark

Light

#E1BEA0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7ba08f;
  --color-2: #a4b49a;
  --color-3: #e1bea0;
  --color-4: #eedab5;
  --color-5: #f7f3cd;
}

SCSS

$color-1: #7ba08f;
$color-2: #a4b49a;
$color-3: #e1bea0;
$color-4: #eedab5;
$color-5: #f7f3cd;

TAILWIND

colors: {
  'brand-1': '#7ba08f',
  'brand-2': '#a4b49a',
  'brand-3': '#e1bea0',
  'brand-4': '#eedab5',
  'brand-5': '#f7f3cd',
}

RGB Array

[123, 160, 143], [164, 180, 154], [225, 190, 160], [238, 218, 181], [247, 243, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7BA08F, #A4B49A, #E1BEA0, #EEDAB5, #F7F3CD 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: #7ba08f; --color-2: #a4b49a; --color-3: #e1bea0; --color-4: #eedab5; --color-5: #f7f3cd. 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