← Back to Editor

#AB3345 · #F4756E · #F6AE91 · #598582 · #264F5E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#AB3345

Crimson · Brown · Passion Red

HEX
#AB3345
RGB
rgb(171, 51, 69)
HSL
hsl(351, 54%, 44%)
HSB
hsb(351, 70%, 67%)
CMYK
cmyk(0%, 70%, 60%, 33%)
Oklch
oklch(50.5% 0.155 16.2)

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

#F4756E

Peach Pink · Salmon · Coral Red

HEX
#F4756E
RGB
rgb(244, 117, 110)
HSL
hsl(3, 86%, 69%)
HSB
hsb(3, 55%, 96%)
CMYK
cmyk(0%, 52%, 55%, 4%)
Oklch
oklch(71.0% 0.158 25.1)

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

#F6AE91

Apricot · BurlyWood · Peach Orange

HEX
#F6AE91
RGB
rgb(246, 174, 145)
HSL
hsl(17, 85%, 77%)
HSB
hsb(17, 41%, 96%)
CMYK
cmyk(0%, 29%, 41%, 4%)
Oklch
oklch(81.2% 0.094 42.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#598582

Mineral Blue · SlateGray · Mint Ice

HEX
#598582
RGB
rgb(89, 133, 130)
HSL
hsl(176, 20%, 44%)
HSB
hsb(176, 33%, 52%)
CMYK
cmyk(33%, 0%, 2%, 48%)
Oklch
oklch(58.4% 0.049 190.5)

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

#264F5E

Slate Blue · DarkSlateGray · Mint Ice

HEX
#264F5E
RGB
rgb(38, 79, 94)
HSL
hsl(196, 42%, 26%)
HSB
hsb(196, 60%, 37%)
CMYK
cmyk(60%, 16%, 0%, 63%)
Oklch
oklch(40.5% 0.052 224.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AB3345
34AD9B

Analogous

AD3482
AB3345
AD5E34

Triadic

AB3345
46AD34
3446AD

Split-Comp.

AB3345
34AD5E
3482AD

Tetradic

AB3345
82AD34
34AD9B
5E34AD

Contrast Matrix WCAG 2.1 Contrast

AB3345
F4756E
F6AE91
598582
264F5E
—
2.3
Fail
3.5
AA Large
1.6
Fail
1.4
Fail
2.3
Fail
—
1.5
Fail
1.5
Fail
3.2
AA Large
3.5
AA Large
1.5
Fail
—
2.2
Fail
4.8
AA
1.6
Fail
1.5
Fail
2.2
Fail
—
2.2
Fail
1.4
Fail
3.2
AA Large
4.8
AA
2.2
Fail
—
White BG
6.4AA
2.8Fail
1.8Fail
4.1AA Large
8.9AAA
Black BG
3.3AA Large
7.6AAA
11.4AAA
5.1AA
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

777641
BDBC70
D7D698
6C6C83
38385A

Deuteranopia

7E8740
C4CE70
DBE09A
6A6683
35325A

Tritanopia

A53D3C
EE7171
F29E9F
5B8383
285857

Achromatopsia

595959
9A9A9A
C0C0C0
787878
444444

Shades & Tints Shades & Tints

#AB3345

Dark
Light

#F4756E

Dark
Light

#F6AE91

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ab3345;
  --color-2: #f4756e;
  --color-3: #f6ae91;
  --color-4: #598582;
  --color-5: #264f5e;
}

SCSS

$color-1: #ab3345;
$color-2: #f4756e;
$color-3: #f6ae91;
$color-4: #598582;
$color-5: #264f5e;

TAILWIND

colors: {
  'brand-1': '#ab3345',
  'brand-2': '#f4756e',
  'brand-3': '#f6ae91',
  'brand-4': '#598582',
  'brand-5': '#264f5e',
}

RGB Array

[171, 51, 69], [244, 117, 110], [246, 174, 145], [89, 133, 130], [38, 79, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AB3345, #F4756E, #F6AE91, #598582, #264F5E is ideal for: 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: #ab3345; --color-2: #f4756e; --color-3: #f6ae91; --color-4: #598582; --color-5: #264f5e. 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 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