← Back to Editor

#A8B752 · #F7F2EC · #BFD4E6 · #EB83A8 · #75838C

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#A8B752

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A8B752
RGB
rgb(168, 183, 82)
HSL
hsl(69, 41%, 52%)
HSB
hsb(69, 55%, 72%)
CMYK
cmyk(8%, 0%, 55%, 28%)
Oklch
oklch(74.7% 0.127 116.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#F7F2EC

Goose Yellow · Linen · Peach Orange

HEX
#F7F2EC
RGB
rgb(247, 242, 236)
HSL
hsl(33, 41%, 95%)
HSB
hsb(33, 4%, 97%)
CMYK
cmyk(0%, 2%, 4%, 3%)
Oklch
oklch(96.3% 0.010 72.7)

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

#BFD4E6

Sky Blue · LightBlue · Sky Blue

HEX
#BFD4E6
RGB
rgb(191, 212, 230)
HSL
hsl(208, 44%, 83%)
HSB
hsb(208, 17%, 90%)
CMYK
cmyk(17%, 8%, 0%, 10%)
Oklch
oklch(86.0% 0.034 244.0)

Traditional「Sky Blue」· Paint「Sky Blue」· Creative Twilight Haze

#EB83A8

Rouge · LightCoral · Rose Pink

HEX
#EB83A8
RGB
rgb(235, 131, 168)
HSL
hsl(339, 72%, 72%)
HSB
hsb(339, 44%, 92%)
CMYK
cmyk(0%, 44%, 29%, 8%)
Oklch
oklch(73.3% 0.133 358.2)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#75838C

Slate Blue · SlateGray · Warm Gray

HEX
#75838C
RGB
rgb(117, 131, 140)
HSL
hsl(203, 9%, 50%)
HSB
hsb(203, 16%, 55%)
CMYK
cmyk(16%, 6%, 0%, 45%)
Oklch
oklch(60.2% 0.021 236.0)

Traditional「Slate Blue」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A8B752
6152B7

Analogous

B79452
A8B752
76B752

Triadic

A8B752
52A8B7
B752A8

Split-Comp.

A8B752
5276B7
9452B7

Tetradic

A8B752
52B794
6152B7
B75276

Contrast Matrix WCAG 2.1 Contrast

A8B752
F7F2EC
BFD4E6
EB83A8
75838C
—
2.0
Fail
1.4
Fail
1.1
Fail
1.8
Fail
2.0
Fail
—
1.4
Fail
2.3
Fail
3.5
AA Large
1.4
Fail
1.4
Fail
—
1.7
Fail
2.6
Fail
1.1
Fail
2.3
Fail
1.7
Fail
—
1.6
Fail
1.8
Fail
3.5
AA Large
2.6
Fail
1.6
Fail
—
White BG
2.2Fail
1.1Fail
1.5Fail
2.5Fail
3.9AA Large
Black BG
9.6AAA
18.9AAA
13.8AAA
8.3AAA
5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAF6A
F5F5ED
C8C8E2
BEBD9F
7B7B8A

Deuteranopia

AEAD70
F5F5EE
C7C5E1
C4CC9D
7A7989

Tritanopia

A97E82
F7EFEF
C0DEDD
E69896
768888

Achromatopsia

A7A7A7
F3F3F3
D0D0D0
A6A6A6
808080

Shades & Tints Shades & Tints

#A8B752

Dark
Light

#F7F2EC

Dark
Light

#BFD4E6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a8b752;
  --color-2: #f7f2ec;
  --color-3: #bfd4e6;
  --color-4: #eb83a8;
  --color-5: #75838c;
}

SCSS

$color-1: #a8b752;
$color-2: #f7f2ec;
$color-3: #bfd4e6;
$color-4: #eb83a8;
$color-5: #75838c;

TAILWIND

colors: {
  'brand-1': '#a8b752',
  'brand-2': '#f7f2ec',
  'brand-3': '#bfd4e6',
  'brand-4': '#eb83a8',
  'brand-5': '#75838c',
}

RGB Array

[168, 183, 82], [247, 242, 236], [191, 212, 230], [235, 131, 168], [117, 131, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A8B752, #F7F2EC, #BFD4E6, #EB83A8, #75838C is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #a8b752; --color-2: #f7f2ec; --color-3: #bfd4e6; --color-4: #eb83a8; --color-5: #75838c. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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