← Back to Editor

#FAF6F3 · #E6E1DD · #A1C1CC · #6499AB · #613005

coffee

A 5-color coffee 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

#FAF6F3

Apricot · SeaShell · Peach Orange

HEX
#FAF6F3
RGB
rgb(250, 246, 243)
HSL
hsl(26, 41%, 97%)
HSB
hsb(26, 3%, 98%)
CMYK
cmyk(0%, 2%, 3%, 2%)
Oklch
oklch(97.5% 0.006 59.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E6E1DD

Apricot · Beige · Peach Orange

HEX
#E6E1DD
RGB
rgb(230, 225, 221)
HSL
hsl(27, 15%, 88%)
HSB
hsb(27, 4%, 90%)
CMYK
cmyk(0%, 2%, 4%, 10%)
Oklch
oklch(91.3% 0.008 61.4)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#A1C1CC

Sky Blue · LightSteelBlue · Lake Green

HEX
#A1C1CC
RGB
rgb(161, 193, 204)
HSL
hsl(195, 30%, 72%)
HSB
hsb(195, 21%, 80%)
CMYK
cmyk(21%, 5%, 0%, 20%)
Oklch
oklch(79.1% 0.038 220.6)

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

#6499AB

Slate Blue · CadetBlue · Lake Green

HEX
#6499AB
RGB
rgb(100, 153, 171)
HSL
hsl(195, 30%, 53%)
HSB
hsb(195, 42%, 67%)
CMYK
cmyk(42%, 11%, 0%, 33%)
Oklch
oklch(65.3% 0.062 221.4)

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

#613005

Tangerine · Maroon · Cinnamon

HEX
#613005
RGB
rgb(97, 48, 5)
HSL
hsl(28, 90%, 20%)
HSB
hsb(28, 95%, 38%)
CMYK
cmyk(0%, 51%, 95%, 62%)
Oklch
oklch(36.7% 0.087 54.7)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAF6F3
F4F8FA

Analogous

FAF4F5
FAF6F3
FAFAF4

Triadic

FAF6F3
F4FAF7
F7F4FA

Split-Comp.

FAF6F3
F4FAFA
F4F5FA

Tetradic

FAF6F3
F5FAF4
F4F8FA
FAF4FA

Contrast Matrix WCAG 2.1 Contrast

FAF6F3
E6E1DD
A1C1CC
6499AB
613005
—
1.2
Fail
1.8
Fail
2.9
Fail
10.1
AAA
1.2
Fail
—
1.5
Fail
2.4
Fail
8.4
AAA
1.8
Fail
1.5
Fail
—
1.6
Fail
5.7
AA
2.9
Fail
2.4
Fail
1.6
Fail
—
3.5
AA Large
10.1
AAA
8.4
AAA
5.7
AA
3.5
AA Large
—
White BG
1.1Fail
1.3Fail
1.9Fail
3.1AA Large
10.9AAA
Black BG
19.5AAA
16.2AAA
11.0AAA
6.7AA
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F8F8F4
E4E4DE
AFAFC9
7B7BA7
4C4B0F

Deuteranopia

F9F9F4
E4E5DE
ADABC9
7874A6
4F5212

Tritanopia

FAF4F4
E6DFDF
A3C7C7
67A3A2
5F1819

Achromatopsia

F7F7F7
E2E2E2
B9B9B9
8B8B8B
3A3A3A

Shades & Tints Shades & Tints

#FAF6F3

Dark
Light

#E6E1DD

Dark
Light

#A1C1CC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #faf6f3;
  --color-2: #e6e1dd;
  --color-3: #a1c1cc;
  --color-4: #6499ab;
  --color-5: #613005;
}

SCSS

$color-1: #faf6f3;
$color-2: #e6e1dd;
$color-3: #a1c1cc;
$color-4: #6499ab;
$color-5: #613005;

TAILWIND

colors: {
  'brand-1': '#faf6f3',
  'brand-2': '#e6e1dd',
  'brand-3': '#a1c1cc',
  'brand-4': '#6499ab',
  'brand-5': '#613005',
}

RGB Array

[250, 246, 243], [230, 225, 221], [161, 193, 204], [100, 153, 171], [97, 48, 5]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This coffee-style palette of #FAF6F3, #E6E1DD, #A1C1CC, #6499AB, #613005 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: #faf6f3; --color-2: #e6e1dd; --color-3: #a1c1cc; --color-4: #6499ab; --color-5: #613005. 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 coffee-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