← Back to Editor

#AA5677 · #F1768A · #FBA38C · #FADDB6 · #BBD5AB

warm

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#AA5677

Dark Violet · Gray · Camellia

HEX
#AA5677
RGB
rgb(170, 86, 119)
HSL
hsl(336, 33%, 50%)
HSB
hsb(336, 49%, 67%)
CMYK
cmyk(0%, 49%, 30%, 33%)
Oklch
oklch(56.4% 0.116 356.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#F1768A

Peach Pink · LightCoral · Coral Red

HEX
#F1768A
RGB
rgb(241, 118, 138)
HSL
hsl(350, 81%, 70%)
HSB
hsb(350, 51%, 95%)
CMYK
cmyk(0%, 51%, 43%, 5%)
Oklch
oklch(71.4% 0.152 11.5)

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

#FBA38C

Peach Pink · LightSalmon · Coral Red

HEX
#FBA38C
RGB
rgb(251, 163, 140)
HSL
hsl(12, 93%, 77%)
HSB
hsb(12, 44%, 98%)
CMYK
cmyk(0%, 35%, 44%, 2%)
Oklch
oklch(79.8% 0.110 35.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FADDB6

Goose Yellow · Wheat · Peach Orange

HEX
#FADDB6
RGB
rgb(250, 221, 182)
HSL
hsl(34, 87%, 85%)
HSB
hsb(34, 27%, 98%)
CMYK
cmyk(0%, 12%, 27%, 2%)
Oklch
oklch(91.2% 0.060 75.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#BBD5AB

Celadon · Silver · Apple Green

HEX
#BBD5AB
RGB
rgb(187, 213, 171)
HSL
hsl(97, 33%, 75%)
HSB
hsb(97, 20%, 84%)
CMYK
cmyk(12%, 0%, 20%, 16%)
Oklch
oklch(84.3% 0.063 133.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AA5677
55AA88

Analogous

AA55A1
AA5677
AA5E55

Triadic

AA5677
77AA55
5577AA

Split-Comp.

AA5677
55AA5E
55A1AA

Tetradic

AA5677
A1AA55
55AA88
5E55AA

Contrast Matrix WCAG 2.1 Contrast

AA5677
F1768A
FBA38C
FADDB6
BBD5AB
—
1.8
Fail
2.5
Fail
3.7
AA Large
3.1
AA Large
1.8
Fail
—
1.4
Fail
2.1
Fail
1.7
Fail
2.5
Fail
1.4
Fail
—
1.5
Fail
1.2
Fail
3.7
AA Large
2.1
Fail
1.5
Fail
—
1.2
Fail
3.1
AA Large
1.7
Fail
1.2
Fail
1.2
Fail
—
White BG
4.9AA
2.7Fail
2.0Fail
1.3Fail
1.6Fail
Black BG
4.3AA Large
7.7AAA
10.7AAA
16.1AAA
13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

86856F
BCBB85
D5D492
EDEDBF
C6C6B5

Deuteranopia

8B916D
C3CC84
DAE193
EFF1C2
C5C3B8

Tritanopia

A66967
EB8181
F79697
F9C7C9
BCBDBF

Achromatopsia

737373
9D9D9D
BBBBBB
E1E1E1
C8C8C8

Shades & Tints Shades & Tints

#AA5677

Dark
Light

#F1768A

Dark
Light

#FBA38C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aa5677;
  --color-2: #f1768a;
  --color-3: #fba38c;
  --color-4: #faddb6;
  --color-5: #bbd5ab;
}

SCSS

$color-1: #aa5677;
$color-2: #f1768a;
$color-3: #fba38c;
$color-4: #faddb6;
$color-5: #bbd5ab;

TAILWIND

colors: {
  'brand-1': '#aa5677',
  'brand-2': '#f1768a',
  'brand-3': '#fba38c',
  'brand-4': '#faddb6',
  'brand-5': '#bbd5ab',
}

RGB Array

[170, 86, 119], [241, 118, 138], [251, 163, 140], [250, 221, 182], [187, 213, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This warm-style palette of #AA5677, #F1768A, #FBA38C, #FADDB6, #BBD5AB is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #aa5677; --color-2: #f1768a; --color-3: #fba38c; --color-4: #faddb6; --color-5: #bbd5ab. 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 warm-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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