← Back to Editor

#A7968C · #5E5C5D · #FF62AC · #C2668D · #5B6871

sunset

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A7968C

Tangerine · DarkGray · Warm Sun

HEX
#A7968C
RGB
rgb(167, 150, 140)
HSL
hsl(22, 13%, 60%)
HSB
hsb(22, 16%, 65%)
CMYK
cmyk(0%, 10%, 16%, 35%)
Oklch
oklch(68.5% 0.025 52.5)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#5E5C5D

Ink Gray · DimGray · Charcoal

HEX
#5E5C5D
RGB
rgb(94, 92, 93)
HSL
hsl(330, 1%, 36%)
HSB
hsb(330, 2%, 37%)
CMYK
cmyk(0%, 2%, 1%, 63%)
Oklch
oklch(47.7% 0.003 345.3)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#FF62AC

Rouge · LightCoral · Rose Pink

HEX
#FF62AC
RGB
rgb(255, 98, 172)
HSL
hsl(332, 100%, 69%)
HSB
hsb(332, 62%, 100%)
CMYK
cmyk(0%, 62%, 33%, 0%)
Oklch
oklch(71.8% 0.203 354.2)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#C2668D

Dark Violet · LightCoral · Rose Pink

HEX
#C2668D
RGB
rgb(194, 102, 141)
HSL
hsl(335, 43%, 58%)
HSB
hsb(335, 47%, 76%)
CMYK
cmyk(0%, 47%, 27%, 24%)
Oklch
oklch(62.8% 0.125 354.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#5B6871

Slate Blue · DimGray · Prussian Blue

HEX
#5B6871
RGB
rgb(91, 104, 113)
HSL
hsl(205, 11%, 40%)
HSB
hsb(205, 19%, 44%)
CMYK
cmyk(19%, 8%, 0%, 56%)
Oklch
oklch(51.0% 0.021 238.1)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7968C
8C9DA6

Analogous

A68C8F
A7968C
A6A38C

Triadic

A7968C
8CA695
958CA6

Split-Comp.

A7968C
8CA6A3
8C8FA6

Tetradic

A7968C
8FA68C
8C9DA6
A38CA6

Contrast Matrix WCAG 2.1 Contrast

A7968C
5E5C5D
FF62AC
C2668D
5B6871
—
2.3
Fail
1.0
Fail
1.3
Fail
2.0
Fail
2.3
Fail
—
2.4
Fail
1.8
Fail
1.2
Fail
1.0
Fail
2.4
Fail
—
1.4
Fail
2.1
Fail
1.3
Fail
1.8
Fail
1.4
Fail
—
1.5
Fail
2.0
Fail
1.2
Fail
2.1
Fail
1.5
Fail
—
White BG
2.8Fail
6.6AA
2.8Fail
3.8AA Large
5.7AA
Black BG
7.4AAA
3.2AA Large
7.6AAA
5.6AA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

A09F8E
5D5D5D
BBBA9A
9A9984
61616F

Deuteranopia

A1A28F
5D5D5D
C4D096
A0A681
605F6E

Tritanopia

A69091
5E5D5D
F78C89
BD7C7A
5C6D6D

Achromatopsia

9A9A9A
5D5D5D
999999
868686
656565

Shades & Tints Shades & Tints

#A7968C

Dark
Light

#5E5C5D

Dark
Light

#FF62AC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7968c;
  --color-2: #5e5c5d;
  --color-3: #ff62ac;
  --color-4: #c2668d;
  --color-5: #5b6871;
}

SCSS

$color-1: #a7968c;
$color-2: #5e5c5d;
$color-3: #ff62ac;
$color-4: #c2668d;
$color-5: #5b6871;

TAILWIND

colors: {
  'brand-1': '#a7968c',
  'brand-2': '#5e5c5d',
  'brand-3': '#ff62ac',
  'brand-4': '#c2668d',
  'brand-5': '#5b6871',
}

RGB Array

[167, 150, 140], [94, 92, 93], [255, 98, 172], [194, 102, 141], [91, 104, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #A7968C, #5E5C5D, #FF62AC, #C2668D, #5B6871 is ideal for: corporate websites, product showcases, portfolios. 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: #a7968c; --color-2: #5e5c5d; --color-3: #ff62ac; --color-4: #c2668d; --color-5: #5b6871. 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. 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 sunset-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