← Back to Editor

#FAB96B · #F19474 · #EA777B · #94919A · #69A2A8

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#FAB96B

Ginger · SandyBrown · Warm Sun

HEX
#FAB96B
RGB
rgb(250, 185, 107)
HSL
hsl(33, 93%, 70%)
HSB
hsb(33, 57%, 98%)
CMYK
cmyk(0%, 26%, 57%, 2%)
Oklch
oklch(83.0% 0.121 69.8)

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

#F19474

Apricot · DarkSalmon · Warm Sun

HEX
#F19474
RGB
rgb(241, 148, 116)
HSL
hsl(15, 82%, 70%)
HSB
hsb(15, 52%, 95%)
CMYK
cmyk(0%, 39%, 52%, 5%)
Oklch
oklch(75.6% 0.121 39.7)

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

#EA777B

Peach Pink · LightCoral · Coral Red

HEX
#EA777B
RGB
rgb(234, 119, 123)
HSL
hsl(358, 73%, 69%)
HSB
hsb(358, 49%, 92%)
CMYK
cmyk(0%, 49%, 47%, 8%)
Oklch
oklch(70.2% 0.142 19.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#94919A

Ash · LightSlateGray · Silver Sand

HEX
#94919A
RGB
rgb(148, 145, 154)
HSL
hsl(260, 4%, 59%)
HSB
hsb(260, 6%, 60%)
CMYK
cmyk(4%, 6%, 0%, 40%)
Oklch
oklch(66.2% 0.014 301.2)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#69A2A8

Slate Blue · CadetBlue · Lake Green

HEX
#69A2A8
RGB
rgb(105, 162, 168)
HSL
hsl(186, 27%, 54%)
HSB
hsb(186, 38%, 66%)
CMYK
cmyk(38%, 4%, 0%, 34%)
Oklch
oklch(67.5% 0.060 204.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAB96B
6BABFA

Analogous

FA726B
FAB96B
F3FA6B

Triadic

FAB96B
6BFABA
BA6BFA

Split-Comp.

FAB96B
6BF3FA
726BFA

Tetradic

FAB96B
6BFA72
6BABFA
FA6BF3

Contrast Matrix WCAG 2.1 Contrast

FAB96B
F19474
EA777B
94919A
69A2A8
—
1.3
Fail
1.6
Fail
1.8
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
1.4
Fail
1.3
Fail
1.6
Fail
1.2
Fail
—
1.1
Fail
1.0
Fail
1.8
Fail
1.4
Fail
1.1
Fail
—
1.1
Fail
1.7
Fail
1.3
Fail
1.0
Fail
1.1
Fail
—
White BG
1.7Fail
2.3Fail
2.8Fail
3.1AA Large
2.9Fail
Black BG
12.2AAA
9.2AAA
7.4AAA
6.8AA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDD7E
C9C87C
B8B77A
939398
8282A7

Deuteranopia

E2E782
CED57E
BFC77A
939397
7E7AA6

Tritanopia

F78D90
EC8283
E47979
949696
6CA5A5

Achromatopsia

C4C4C4
ACACAC
9A9A9A
939393
929292

Shades & Tints Shades & Tints

#FAB96B

Dark
Light

#F19474

Dark
Light

#EA777B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fab96b;
  --color-2: #f19474;
  --color-3: #ea777b;
  --color-4: #94919a;
  --color-5: #69a2a8;
}

SCSS

$color-1: #fab96b;
$color-2: #f19474;
$color-3: #ea777b;
$color-4: #94919a;
$color-5: #69a2a8;

TAILWIND

colors: {
  'brand-1': '#fab96b',
  'brand-2': '#f19474',
  'brand-3': '#ea777b',
  'brand-4': '#94919a',
  'brand-5': '#69a2a8',
}

RGB Array

[250, 185, 107], [241, 148, 116], [234, 119, 123], [148, 145, 154], [105, 162, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAB96B, #F19474, #EA777B, #94919A, #69A2A8 is ideal for: corporate websites, product showcases, portfolios. 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: #fab96b; --color-2: #f19474; --color-3: #ea777b; --color-4: #94919a; --color-5: #69a2a8. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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