← Back to Editor

#544550 · #C85A65 · #F27D78 · #F89D80 · #BEC6B2

summer

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#544550

Rose Purple · DarkSlateGray · Eggplant

HEX
#544550
RGB
rgb(84, 69, 80)
HSL
hsl(316, 10%, 30%)
HSB
hsb(316, 18%, 33%)
CMYK
cmyk(0%, 18%, 5%, 67%)
Oklch
oklch(41.0% 0.027 335.6)

TraditionalRose Purple」· PaintEggplant」· Creative Blush Sunrise

#C85A65

Crimson · LightCoral · Passion Red

HEX
#C85A65
RGB
rgb(200, 90, 101)
HSL
hsl(354, 50%, 57%)
HSB
hsb(354, 55%, 78%)
CMYK
cmyk(0%, 55%, 50%, 22%)
Oklch
oklch(60.7% 0.140 16.1)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#F27D78

Peach Pink · LightCoral · Coral Red

HEX
#F27D78
RGB
rgb(242, 125, 120)
HSL
hsl(2, 82%, 71%)
HSB
hsb(2, 50%, 95%)
CMYK
cmyk(0%, 48%, 50%, 5%)
Oklch
oklch(72.1% 0.145 23.8)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#F89D80

Apricot · LightSalmon · Warm Sun

HEX
#F89D80
RGB
rgb(248, 157, 128)
HSL
hsl(15, 90%, 74%)
HSB
hsb(15, 48%, 97%)
CMYK
cmyk(0%, 37%, 48%, 3%)
Oklch
oklch(78.2% 0.117 38.4)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#BEC6B2

Willow Green · Silver · Apple Green

HEX
#BEC6B2
RGB
rgb(190, 198, 178)
HSL
hsl(84, 15%, 74%)
HSB
hsb(84, 10%, 78%)
CMYK
cmyk(4%, 0%, 10%, 22%)
Oklch
oklch(81.5% 0.029 124.9)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

544550
455449

Analogous

514554
544550
544548

Triadic

544550
505445
455054

Split-Comp.

544550
485445
455451

Tetradic

544550
545145
455449
454854

Contrast Matrix WCAG 2.1 Contrast

544550
C85A65
F27D78
F89D80
BEC6B2
2.2
Fail
3.4
AA Large
4.3
AA Large
5.1
AA
2.2
Fail
1.6
Fail
2.0
Fail
2.3
Fail
3.4
AA Large
1.6
Fail
1.3
Fail
1.5
Fail
4.3
AA Large
2.0
Fail
1.3
Fail
1.2
Fail
5.1
AA
2.3
Fail
1.5
Fail
1.2
Fail
White BG
9.0AAA
4.1AA Large
2.6Fail
2.1Fail
1.8Fail
Black BG
2.3Fail
5.1AA
8.0AAA
10.1AAA
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4D4D
989762
BFBE79
D1D087
C1C2B7

Deuteranopia

4E504D
9FA762
C6CF7A
D6DD89
C1C0B8

Tritanopia

534B4B
C36060
EC7A7A
F38D8E
BEBBBC

Achromatopsia

4B4B4B
7C7C7C
9F9F9F
B5B5B5
C1C1C1

Shades & Tints Shades & Tints

#544550

Dark
Light

#C85A65

Dark
Light

#F27D78

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #544550;
  --color-2: #c85a65;
  --color-3: #f27d78;
  --color-4: #f89d80;
  --color-5: #bec6b2;
}

SCSS

$color-1: #544550;
$color-2: #c85a65;
$color-3: #f27d78;
$color-4: #f89d80;
$color-5: #bec6b2;

TAILWIND

colors: {
  'brand-1': '#544550',
  'brand-2': '#c85a65',
  'brand-3': '#f27d78',
  'brand-4': '#f89d80',
  'brand-5': '#bec6b2',
}

RGB Array

[84, 69, 80], [200, 90, 101], [242, 125, 120], [248, 157, 128], [190, 198, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #544550, #C85A65, #F27D78, #F89D80, #BEC6B2 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: #544550; --color-2: #c85a65; --color-3: #f27d78; --color-4: #f89d80; --color-5: #bec6b2. 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 summer-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