← Back to Editor

#F5EFF8 · #1AB0C4 · #F1640F · #89140B · #29222B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#F5EFF8

Lilac · Snow · Lavender

HEX
#F5EFF8
RGB
rgb(245, 239, 248)
HSL
hsl(280, 39%, 95%)
HSB
hsb(280, 4%, 97%)
CMYK
cmyk(1%, 4%, 0%, 3%)
Oklch
oklch(95.9% 0.013 314.8)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#1AB0C4

Lake Blue · LightSeaGreen · Mint Ice

HEX
#1AB0C4
RGB
rgb(26, 176, 196)
HSL
hsl(187, 77%, 44%)
HSB
hsb(187, 87%, 77%)
CMYK
cmyk(87%, 10%, 0%, 23%)
Oklch
oklch(69.5% 0.116 209.6)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#F1640F

Tangerine · Chocolate · Amber Brown

HEX
#F1640F
RGB
rgb(241, 100, 15)
HSL
hsl(23, 89%, 50%)
HSB
hsb(23, 94%, 95%)
CMYK
cmyk(0%, 59%, 94%, 5%)
Oklch
oklch(67.2% 0.191 43.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#89140B

Vermilion · DarkRed · Wine Red

HEX
#89140B
RGB
rgb(137, 20, 11)
HSL
hsl(4, 85%, 29%)
HSB
hsb(4, 92%, 54%)
CMYK
cmyk(0%, 85%, 92%, 46%)
Oklch
oklch(40.6% 0.152 29.7)

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

#29222B

Dark Plum · DarkSlateGray · Dark Purple

HEX
#29222B
RGB
rgb(41, 34, 43)
HSL
hsl(287, 12%, 15%)
HSB
hsb(287, 21%, 17%)
CMYK
cmyk(5%, 21%, 0%, 83%)
Oklch
oklch(26.4% 0.019 318.7)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5EFF8
F1F7ED

Analogous

EFEDF7
F5EFF8
F7EDF6

Triadic

F5EFF8
F7F4ED
EDF7F4

Split-Comp.

F5EFF8
F6F7ED
EDF7EF

Tetradic

F5EFF8
F7EFED
F1F7ED
EDF6F7

Contrast Matrix WCAG 2.1 Contrast

F5EFF8
1AB0C4
F1640F
89140B
29222B
—
2.3
Fail
2.8
Fail
8.6
AAA
13.7
AAA
2.3
Fail
—
1.2
Fail
3.7
AA Large
5.9
AA
2.8
Fail
1.2
Fail
—
3.0
AA Large
4.8
AA
8.6
AAA
3.7
AA Large
3.0
AA Large
—
1.6
Fail
13.7
AAA
5.9
AA
4.8
AA
1.6
Fail
—
White BG
1.1Fail
2.6Fail
3.2AA Large
9.7AAA
15.5AAA
Black BG
18.6AAA
8.1AAA
6.6AA
2.2Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F2F2F6
5B5CBF
B4B324
56550D
262629

Deuteranopia

F3F3F5
5247BE
BCC729
5D660E
262728

Tritanopia

F5F4F4
22BBBB
EA3437
830F0F
292727

Achromatopsia

F2F2F2
858585
848484
363636
252525

Shades & Tints Shades & Tints

#F5EFF8

Dark
Light

#1AB0C4

Dark
Light

#F1640F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5eff8;
  --color-2: #1ab0c4;
  --color-3: #f1640f;
  --color-4: #89140b;
  --color-5: #29222b;
}

SCSS

$color-1: #f5eff8;
$color-2: #1ab0c4;
$color-3: #f1640f;
$color-4: #89140b;
$color-5: #29222b;

TAILWIND

colors: {
  'brand-1': '#f5eff8',
  'brand-2': '#1ab0c4',
  'brand-3': '#f1640f',
  'brand-4': '#89140b',
  'brand-5': '#29222b',
}

RGB Array

[245, 239, 248], [26, 176, 196], [241, 100, 15], [137, 20, 11], [41, 34, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F5EFF8, #1AB0C4, #F1640F, #89140B, #29222B is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #f5eff8; --color-2: #1ab0c4; --color-3: #f1640f; --color-4: #89140b; --color-5: #29222b. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 general-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