← Back to Editor

#F2DADE · #F7E9D2 · #B3A590 · #A37C8A · #756767

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

#F2DADE

Peach Pink · Linen · Cherry Blossom

HEX
#F2DADE
RGB
rgb(242, 218, 222)
HSL
hsl(350, 48%, 90%)
HSB
hsb(350, 10%, 95%)
CMYK
cmyk(0%, 10%, 8%, 5%)
Oklch
oklch(90.9% 0.027 6.2)

TraditionalPeach Pink」· PaintCherry Blossom」· Creative Rose Petal

#F7E9D2

Goose Yellow · Beige · Peach Orange

HEX
#F7E9D2
RGB
rgb(247, 233, 210)
HSL
hsl(37, 70%, 90%)
HSB
hsb(37, 15%, 97%)
CMYK
cmyk(0%, 6%, 15%, 3%)
Oklch
oklch(93.9% 0.034 80.3)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

#B3A590

Ginger · DarkGray · Warm Sun

HEX
#B3A590
RGB
rgb(179, 165, 144)
HSL
hsl(36, 19%, 63%)
HSB
hsb(36, 20%, 70%)
CMYK
cmyk(0%, 8%, 20%, 30%)
Oklch
oklch(72.8% 0.034 78.1)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#A37C8A

Dark Violet · Gray · Rose Pink

HEX
#A37C8A
RGB
rgb(163, 124, 138)
HSL
hsl(338, 17%, 56%)
HSB
hsb(338, 24%, 64%)
CMYK
cmyk(0%, 24%, 15%, 36%)
Oklch
oklch(62.8% 0.052 355.3)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

#756767

Ink Gray · DimGray · Warm Gray

HEX
#756767
RGB
rgb(117, 103, 103)
HSL
hsl(0, 6%, 43%)
HSB
hsb(0, 12%, 46%)
CMYK
cmyk(0%, 12%, 12%, 54%)
Oklch
oklch(52.7% 0.018 17.7)

TraditionalInk Gray」· PaintWarm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2DADE
D9F2EE

Analogous

F2D9EA
F2DADE
F2E1D9

Triadic

F2DADE
DDF2D9
D9DDF2

Split-Comp.

F2DADE
D9F2E1
D9EAF2

Tetradic

F2DADE
EAF2D9
D9F2EE
E1D9F2

Contrast Matrix WCAG 2.1 Contrast

F2DADE
F7E9D2
B3A590
A37C8A
756767
1.1
Fail
1.8
Fail
2.7
Fail
4.1
AA Large
1.1
Fail
2.0
Fail
3.0
AA Large
4.5
AA
1.8
Fail
2.0
Fail
1.5
Fail
2.2
Fail
2.7
Fail
3.0
AA Large
1.5
Fail
1.5
Fail
4.1
AA Large
4.5
AA
2.2
Fail
1.5
Fail
White BG
1.3Fail
1.2Fail
2.4Fail
3.6AA Large
5.4AA
Black BG
15.9AAA
17.5AAA
8.7AAA
5.8AA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

E8E7DD
F1F1D8
ADAD95
929287
6F6F67

Deuteranopia

E9EBDD
F2F3D9
AEAF96
949786
707167

Tritanopia

F1DCDC
F6DCDD
B2999A
A18483
746767

Achromatopsia

E2E2E2
EBEBEB
A7A7A7
898989
6B6B6B

Shades & Tints Shades & Tints

#F2DADE

Dark
Light

#F7E9D2

Dark
Light

#B3A590

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2dade;
  --color-2: #f7e9d2;
  --color-3: #b3a590;
  --color-4: #a37c8a;
  --color-5: #756767;
}

SCSS

$color-1: #f2dade;
$color-2: #f7e9d2;
$color-3: #b3a590;
$color-4: #a37c8a;
$color-5: #756767;

TAILWIND

colors: {
  'brand-1': '#f2dade',
  'brand-2': '#f7e9d2',
  'brand-3': '#b3a590',
  'brand-4': '#a37c8a',
  'brand-5': '#756767',
}

RGB Array

[242, 218, 222], [247, 233, 210], [179, 165, 144], [163, 124, 138], [117, 103, 103]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #F2DADE, #F7E9D2, #B3A590, #A37C8A, #756767 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: #f2dade; --color-2: #f7e9d2; --color-3: #b3a590; --color-4: #a37c8a; --color-5: #756767. 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