← Back to Editor

#C7AD03 · #CF6007 · #279478 · #093141 · #DF5151

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

#C7AD03

Autumn Sage · GoldenRod · Honey Gold

HEX
#C7AD03
RGB
rgb(199, 173, 3)
HSL
hsl(52, 97%, 40%)
HSB
hsb(52, 98%, 78%)
CMYK
cmyk(0%, 13%, 98%, 22%)
Oklch
oklch(74.8% 0.154 98.3)

TraditionalAutumn Sage」· PaintHoney Gold」· Creative Blush Sunrise

#CF6007

Tangerine · Chocolate · Amber Brown

HEX
#CF6007
RGB
rgb(207, 96, 7)
HSL
hsl(27, 93%, 42%)
HSB
hsb(27, 97%, 81%)
CMYK
cmyk(0%, 54%, 97%, 19%)
Oklch
oklch(61.5% 0.162 49.2)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

#279478

Mineral Blue · SeaGreen · Mint Ice

HEX
#279478
RGB
rgb(39, 148, 120)
HSL
hsl(165, 58%, 37%)
HSB
hsb(165, 74%, 58%)
CMYK
cmyk(74%, 0%, 19%, 42%)
Oklch
oklch(59.9% 0.105 171.4)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#093141

Lake Blue · DarkSlateGray · Peacock Green

HEX
#093141
RGB
rgb(9, 49, 65)
HSL
hsl(197, 76%, 15%)
HSB
hsb(197, 86%, 25%)
CMYK
cmyk(86%, 25%, 0%, 75%)
Oklch
oklch(29.5% 0.051 229.5)

TraditionalLake Blue」· PaintPeacock Green」· Creative Blush Sunrise

#DF5151

Vermilion · Tomato · Passion Red

HEX
#DF5151
RGB
rgb(223, 81, 81)
HSL
hsl(0, 69%, 60%)
HSB
hsb(0, 64%, 87%)
CMYK
cmyk(0%, 64%, 64%, 13%)
Oklch
oklch(62.7% 0.178 23.8)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7AD03
031DC9

Analogous

C94C03
C7AD03
80C903

Triadic

C7AD03
03C9AF
AF03C9

Split-Comp.

C7AD03
0380C9
4C03C9

Tetradic

C7AD03
03C94C
031DC9
C90380

Contrast Matrix WCAG 2.1 Contrast

C7AD03
CF6007
279478
093141
DF5151
1.8
Fail
1.7
Fail
6.2
AA
1.7
Fail
1.8
Fail
1.0
Fail
3.5
AA Large
1.0
Fail
1.7
Fail
1.0
Fail
3.7
AA Large
1.0
Fail
6.2
AA
3.5
AA Large
3.7
AA Large
3.6
AA Large
1.7
Fail
1.0
Fail
1.0
Fail
3.6
AA Large
White BG
2.2Fail
3.9AA Large
3.8AA Large
13.8AAA
3.9AA Large
Black BG
9.4AAA
5.3AA
5.6AA
1.5Fail
5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBC2C
9F9E1D
56577F
1A1B3D
A2A051

Deuteranopia

BDBF36
A5AE22
504880
18153C
AAB451

Tritanopia

C64D54
C92E31
2C8485
0B3A39
D85151

Achromatopsia

A1A1A1
777777
707070
272727
7B7B7B

Shades & Tints Shades & Tints

#C7AD03

Dark
Light

#CF6007

Dark
Light

#279478

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7ad03;
  --color-2: #cf6007;
  --color-3: #279478;
  --color-4: #093141;
  --color-5: #df5151;
}

SCSS

$color-1: #c7ad03;
$color-2: #cf6007;
$color-3: #279478;
$color-4: #093141;
$color-5: #df5151;

TAILWIND

colors: {
  'brand-1': '#c7ad03',
  'brand-2': '#cf6007',
  'brand-3': '#279478',
  'brand-4': '#093141',
  'brand-5': '#df5151',
}

RGB Array

[199, 173, 3], [207, 96, 7], [39, 148, 120], [9, 49, 65], [223, 81, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7AD03, #CF6007, #279478, #093141, #DF5151 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: #c7ad03; --color-2: #cf6007; --color-3: #279478; --color-4: #093141; --color-5: #df5151. 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