#D53734 + #F5DDAD + #FEEEB0 + #D0D5AD + #B4C5A3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D53734

Vermilion · Crimson · Passion Red

HEX

#D53734

RGB

rgb(213, 55, 52)

HSL

hsl(1, 66%, 52%)

HSB

hsb(1, 76%, 84%)

CMYK

cmyk(0%, 74%, 76%, 16%)

Oklch

oklch(57.9% 0.195 26.6)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#F5DDAD

Goose Yellow · Wheat · Lemon Cream

HEX

#F5DDAD

RGB

rgb(245, 221, 173)

HSL

hsl(40, 78%, 82%)

HSB

hsb(40, 29%, 96%)

CMYK

cmyk(0%, 10%, 29%, 4%)

Oklch

oklch(90.6% 0.068 84.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#FEEEB0

Goose Yellow · Wheat · Lemon Cream

HEX

#FEEEB0

RGB

rgb(254, 238, 176)

HSL

hsl(48, 98%, 84%)

HSB

hsb(48, 31%, 100%)

CMYK

cmyk(0%, 6%, 31%, 0%)

Oklch

oklch(94.7% 0.081 95.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#D0D5AD

Fresh Green · Silver · Lemon Cream

HEX

#D0D5AD

RGB

rgb(208, 213, 173)

HSL

hsl(68, 32%, 76%)

HSB

hsb(68, 19%, 84%)

CMYK

cmyk(2%, 0%, 19%, 16%)

Oklch

oklch(85.9% 0.054 113.3)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#B4C5A3

Celadon · DarkGray · Apple Green

HEX

#B4C5A3

RGB

rgb(180, 197, 163)

HSL

hsl(90, 23%, 71%)

HSB

hsb(90, 17%, 77%)

CMYK

cmyk(9%, 0%, 17%, 23%)

Oklch

oklch(80.1% 0.050 129.2)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D53734

34D3D5

Analogous

D53482

D53734

D58734

Triadic

D53734

34D537

3734D5

Split-Comp.

D53734

34D587

3482D5

Tetradic

D53734

82D534

34D3D5

8734D5

Contrast Matrix WCAG 2.1 Contrast

D53734	F5DDAD	FEEEB0	D0D5AD	B4C5A3
—	3.6 AA Large	4.1 AA Large	3.1 AA Large	2.6 Fail
3.6 AA Large	—	1.1 Fail	1.1 Fail	1.4 Fail
4.1 AA Large	1.1 Fail	—	1.3 Fail	1.6 Fail
3.1 AA Large	1.1 Fail	1.3 Fail	—	1.2 Fail
2.6 Fail	1.4 Fail	1.6 Fail	1.2 Fail	—

White BG

4.7AA

1.3Fail

1.2Fail

1.5Fail

1.8Fail

Black BG

4.4AA Large

15.8AAA

18.1AAA

13.8AAA

11.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

918F35

EBEAB9

F7F7BF

D2D2B7

BBBCAB

Deuteranopia

9AA635

ECEEBB

F8F9C3

D2D2B9

BAB9AD

Tritanopia

CD3535

F4C2C4

FDCBCD

D0BEC0

B5B2B3

Achromatopsia

666666

DFDFDF

ECECEC

CFCFCF

BCBCBC

Shades & Tints Shades & Tints

#D53734

Dark

Light

#F5DDAD

Dark

Light

#FEEEB0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d53734;
  --color-2: #f5ddad;
  --color-3: #feeeb0;
  --color-4: #d0d5ad;
  --color-5: #b4c5a3;
}

SCSS

$color-1: #d53734;
$color-2: #f5ddad;
$color-3: #feeeb0;
$color-4: #d0d5ad;
$color-5: #b4c5a3;

TAILWIND

colors: {
  'brand-1': '#d53734',
  'brand-2': '#f5ddad',
  'brand-3': '#feeeb0',
  'brand-4': '#d0d5ad',
  'brand-5': '#b4c5a3',
}

RGB Array

[213, 55, 52], [245, 221, 173], [254, 238, 176], [208, 213, 173], [180, 197, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D53734, #F5DDAD, #FEEEB0, #D0D5AD, #B4C5A3 is ideal for: health products, baby brands, fresh-style blogs. 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: #d53734; --color-2: #f5ddad; --color-3: #feeeb0; --color-4: #d0d5ad; --color-5: #b4c5a3. 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. 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