← Back to Editor

#68494F · #F3E8AD · #D3C7A4 · #E37D78 · #F0CCB2

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#68494F

Crimson · DimGray · Wine Red

HEX
#68494F
RGB
rgb(104, 73, 79)
HSL
hsl(348, 18%, 35%)
HSB
hsb(348, 30%, 41%)
CMYK
cmyk(0%, 30%, 24%, 59%)
Oklch
oklch(44.1% 0.043 6.2)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#F3E8AD

Fresh Green · Wheat · Lemon Cream

HEX
#F3E8AD
RGB
rgb(243, 232, 173)
HSL
hsl(51, 74%, 82%)
HSB
hsb(51, 29%, 95%)
CMYK
cmyk(0%, 5%, 29%, 5%)
Oklch
oklch(92.6% 0.077 98.8)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#D3C7A4

Goose Yellow · Tan · Sunflower

HEX
#D3C7A4
RGB
rgb(211, 199, 164)
HSL
hsl(45, 35%, 74%)
HSB
hsb(45, 22%, 83%)
CMYK
cmyk(0%, 6%, 22%, 17%)
Oklch
oklch(83.1% 0.049 91.4)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

#E37D78

Peach Pink · LightCoral · Coral Red

HEX
#E37D78
RGB
rgb(227, 125, 120)
HSL
hsl(3, 66%, 68%)
HSB
hsb(3, 47%, 89%)
CMYK
cmyk(0%, 45%, 47%, 11%)
Oklch
oklch(70.1% 0.127 23.8)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#F0CCB2

Apricot · Wheat · Peach Orange

HEX
#F0CCB2
RGB
rgb(240, 204, 178)
HSL
hsl(25, 67%, 82%)
HSB
hsb(25, 26%, 94%)
CMYK
cmyk(0%, 15%, 26%, 6%)
Oklch
oklch(86.9% 0.054 57.8)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

68494F
496963

Analogous

694960
68494F
695349

Triadic

68494F
506949
495069

Split-Comp.

68494F
496953
496069

Tetradic

68494F
606949
496963
534969

Contrast Matrix WCAG 2.1 Contrast

68494F
F3E8AD
D3C7A4
E37D78
F0CCB2
6.4
AA
4.7
AA
2.8
Fail
5.3
AA
6.4
AA
1.4
Fail
2.3
Fail
1.2
Fail
4.7
AA
1.4
Fail
1.7
Fail
1.1
Fail
2.8
Fail
2.3
Fail
1.7
Fail
1.9
Fail
5.3
AA
1.2
Fail
1.1
Fail
1.9
Fail
White BG
7.9AAA
1.2Fail
1.7Fail
2.8Fail
1.5Fail
Black BG
2.7Fail
17.0AAA
12.5AAA
7.5AAA
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5A4E
EEEEBB
CECEAC
B7B679
E0E0B8

Deuteranopia

5C5F4D
EFF0BF
CFCFAF
BDC47A
E3E5BA

Tritanopia

664C4C
F2C7C9
D2B3B5
DE7A7A
EEBDBE

Achromatopsia

535353
E5E5E5
C7C7C7
9B9B9B
D4D4D4

Shades & Tints Shades & Tints

#68494F

Dark
Light

#F3E8AD

Dark
Light

#D3C7A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #68494f;
  --color-2: #f3e8ad;
  --color-3: #d3c7a4;
  --color-4: #e37d78;
  --color-5: #f0ccb2;
}

SCSS

$color-1: #68494f;
$color-2: #f3e8ad;
$color-3: #d3c7a4;
$color-4: #e37d78;
$color-5: #f0ccb2;

TAILWIND

colors: {
  'brand-1': '#68494f',
  'brand-2': '#f3e8ad',
  'brand-3': '#d3c7a4',
  'brand-4': '#e37d78',
  'brand-5': '#f0ccb2',
}

RGB Array

[104, 73, 79], [243, 232, 173], [211, 199, 164], [227, 125, 120], [240, 204, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #68494F, #F3E8AD, #D3C7A4, #E37D78, #F0CCB2 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: #68494f; --color-2: #f3e8ad; --color-3: #d3c7a4; --color-4: #e37d78; --color-5: #f0ccb2. 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 warm-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