← Back to Editor

#230616 · #700918 · #BC3D1C · #E8A631 · #66988C

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

#230616

Rose Purple · Black · Raspberry

HEX
#230616
RGB
rgb(35, 6, 22)
HSL
hsl(327, 71%, 8%)
HSB
hsb(327, 83%, 14%)
CMYK
cmyk(0%, 83%, 37%, 86%)
Oklch
oklch(18.3% 0.055 349.3)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#700918

Vermilion · Maroon · Wine Red

HEX
#700918
RGB
rgb(112, 9, 24)
HSL
hsl(351, 85%, 24%)
HSB
hsb(351, 92%, 44%)
CMYK
cmyk(0%, 92%, 79%, 56%)
Oklch
oklch(35.0% 0.133 21.8)

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

#BC3D1C

Vermilion · FireBrick · Passion Red

HEX
#BC3D1C
RGB
rgb(188, 61, 28)
HSL
hsl(12, 74%, 42%)
HSB
hsb(12, 85%, 74%)
CMYK
cmyk(0%, 68%, 85%, 26%)
Oklch
oklch(54.0% 0.169 35.1)

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

#E8A631

Ginger · GoldenRod · Warm Sun

HEX
#E8A631
RGB
rgb(232, 166, 49)
HSL
hsl(38, 80%, 55%)
HSB
hsb(38, 79%, 91%)
CMYK
cmyk(0%, 28%, 79%, 9%)
Oklch
oklch(77.0% 0.146 76.7)

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

#66988C

Mineral Blue · CadetBlue · Mint Ice

HEX
#66988C
RGB
rgb(102, 152, 140)
HSL
hsl(166, 20%, 50%)
HSB
hsb(166, 33%, 60%)
CMYK
cmyk(33%, 0%, 8%, 40%)
Oklch
oklch(64.1% 0.057 177.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

230616
062313

Analogous

210623
230616
230607

Triadic

230616
162306
061623

Split-Comp.

230616
072306
062321

Tetradic

230616
232106
062313
060723

Contrast Matrix WCAG 2.1 Contrast

230616
700918
BC3D1C
E8A631
66988C
—
1.6
Fail
3.4
AA Large
9.0
AAA
5.8
AA
1.6
Fail
—
2.2
Fail
5.7
AA
3.7
AA Large
3.4
AA Large
2.2
Fail
—
2.6
Fail
1.7
Fail
9.0
AAA
5.7
AA
2.6
Fail
—
1.5
Fail
5.8
AA
3.7
AA Large
1.7
Fail
1.5
Fail
—
White BG
18.9AAA
12.1AAA
5.5AA
2.1Fail
3.3AA Large
Black BG
1.1Fail
1.7Fail
3.8AA Large
9.9AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

161612
434214
858424
CBCB4D
7C7C8F

Deuteranopia

181A11
495113
8C9626
CFD454
797590

Tritanopia

220F0E
6B1211
B62A2C
E56469
689192

Achromatopsia

101010
2A2A2A
5F5F5F
ACACAC
888888

Shades & Tints Shades & Tints

#230616

Dark
Light

#700918

Dark
Light

#BC3D1C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #230616;
  --color-2: #700918;
  --color-3: #bc3d1c;
  --color-4: #e8a631;
  --color-5: #66988c;
}

SCSS

$color-1: #230616;
$color-2: #700918;
$color-3: #bc3d1c;
$color-4: #e8a631;
$color-5: #66988c;

TAILWIND

colors: {
  'brand-1': '#230616',
  'brand-2': '#700918',
  'brand-3': '#bc3d1c',
  'brand-4': '#e8a631',
  'brand-5': '#66988c',
}

RGB Array

[35, 6, 22], [112, 9, 24], [188, 61, 28], [232, 166, 49], [102, 152, 140]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #230616, #700918, #BC3D1C, #E8A631, #66988C is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #230616; --color-2: #700918; --color-3: #bc3d1c; --color-4: #e8a631; --color-5: #66988c. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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