← Back to Editor

#F59315 · #F23649 · #C1094B · #66821F · #F9F81E

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#F59315

Ginger · Orange · Warm Sun

HEX
#F59315
RGB
rgb(245, 147, 21)
HSL
hsl(34, 92%, 52%)
HSB
hsb(34, 91%, 96%)
CMYK
cmyk(0%, 40%, 91%, 4%)
Oklch
oklch(75.0% 0.166 63.6)

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

#F23649

Vermilion · Crimson · Passion Red

HEX
#F23649
RGB
rgb(242, 54, 73)
HSL
hsl(354, 88%, 58%)
HSB
hsb(354, 78%, 95%)
CMYK
cmyk(0%, 78%, 70%, 5%)
Oklch
oklch(63.1% 0.221 21.5)

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

#C1094B

Dark Violet · Crimson · Camellia

HEX
#C1094B
RGB
rgb(193, 9, 75)
HSL
hsl(338, 91%, 40%)
HSB
hsb(338, 95%, 76%)
CMYK
cmyk(0%, 95%, 61%, 24%)
Oklch
oklch(52.0% 0.204 11.0)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#66821F

Grass Green · DarkOliveGreen · Forest Green

HEX
#66821F
RGB
rgb(102, 130, 31)
HSL
hsl(77, 61%, 32%)
HSB
hsb(77, 76%, 51%)
CMYK
cmyk(22%, 0%, 76%, 49%)
Oklch
oklch(56.5% 0.127 124.4)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#F9F81E

Autumn Sage · Yellow · Sunflower

HEX
#F9F81E
RGB
rgb(249, 248, 30)
HSL
hsl(60, 95%, 55%)
HSB
hsb(60, 88%, 98%)
CMYK
cmyk(0%, 0%, 88%, 2%)
Oklch
oklch(94.9% 0.202 109.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F59315
1476F5

Analogous

F52314
F59315
E6F514

Triadic

F59315
14F594
9414F5

Split-Comp.

F59315
14E6F5
2314F5

Tetradic

F59315
14F523
1476F5
F514E6

Contrast Matrix WCAG 2.1 Contrast

F59315
F23649
C1094B
66821F
F9F81E
—
1.7
Fail
2.7
Fail
1.9
Fail
2.0
Fail
1.7
Fail
—
1.6
Fail
1.1
Fail
3.4
AA Large
2.7
Fail
1.6
Fail
—
1.4
Fail
5.4
AA
1.9
Fail
1.1
Fail
1.4
Fail
—
3.9
AA Large
2.0
Fail
3.4
AA Large
5.4
AA
3.9
AA Large
—
White BG
2.3Fail
3.9AA Large
6.2AA
4.4AA Large
1.1Fail
Black BG
9.1AAA
5.4AA
3.4AA Large
4.8AA
18.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCA33
A19F44
71703B
727237
F9F953

Deuteranopia

D0D83B
ACBA43
7C8A37
716E3D
F9F95F

Tritanopia

F04C51
E94140
B82E2C
674A4E
F97C86

Achromatopsia

A2A2A2
707070
484848
6E6E6E
DFDFDF

Shades & Tints Shades & Tints

#F59315

Dark
Light

#F23649

Dark
Light

#C1094B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f59315;
  --color-2: #f23649;
  --color-3: #c1094b;
  --color-4: #66821f;
  --color-5: #f9f81e;
}

SCSS

$color-1: #f59315;
$color-2: #f23649;
$color-3: #c1094b;
$color-4: #66821f;
$color-5: #f9f81e;

TAILWIND

colors: {
  'brand-1': '#f59315',
  'brand-2': '#f23649',
  'brand-3': '#c1094b',
  'brand-4': '#66821f',
  'brand-5': '#f9f81e',
}

RGB Array

[245, 147, 21], [242, 54, 73], [193, 9, 75], [102, 130, 31], [249, 248, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F59315, #F23649, #C1094B, #66821F, #F9F81E is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #f59315; --color-2: #f23649; --color-3: #c1094b; --color-4: #66821f; --color-5: #f9f81e. 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 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