← Back to Editor

#FF6E3D · #FF3341 · #D91818 · #7D1B1B · #380827

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile AppData Visualization

Color Details Color Details

#FF6E3D

Apricot · Tomato · Warm Sun

HEX
#FF6E3D
RGB
rgb(255, 110, 61)
HSL
hsl(15, 100%, 62%)
HSB
hsb(15, 76%, 100%)
CMYK
cmyk(0%, 57%, 76%, 0%)
Oklch
oklch(70.9% 0.188 38.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FF3341

Vermilion · Crimson · Passion Red

HEX
#FF3341
RGB
rgb(255, 51, 65)
HSL
hsl(356, 100%, 60%)
HSB
hsb(356, 80%, 100%)
CMYK
cmyk(0%, 80%, 75%, 0%)
Oklch
oklch(65.0% 0.236 23.9)

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

#D91818

Vermilion · Crimson · Passion Red

HEX
#D91818
RGB
rgb(217, 24, 24)
HSL
hsl(0, 80%, 47%)
HSB
hsb(0, 89%, 85%)
CMYK
cmyk(0%, 89%, 89%, 15%)
Oklch
oklch(56.3% 0.221 28.2)

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

#7D1B1B

Vermilion · Maroon · Wine Red

HEX
#7D1B1B
RGB
rgb(125, 27, 27)
HSL
hsl(0, 64%, 30%)
HSB
hsb(0, 78%, 49%)
CMYK
cmyk(0%, 78%, 78%, 51%)
Oklch
oklch(39.0% 0.133 25.9)

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

#380827

Rose Purple · Black · Raspberry

HEX
#380827
RGB
rgb(56, 8, 39)
HSL
hsl(321, 75%, 13%)
HSB
hsb(321, 86%, 22%)
CMYK
cmyk(0%, 86%, 30%, 78%)
Oklch
oklch(23.8% 0.084 345.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF6E3D
3DCFFF

Analogous

FF3D6E
FF6E3D
FFCF3D

Triadic

FF6E3D
3DFF6E
6E3DFF

Split-Comp.

FF6E3D
3DFFCF
3D6EFF

Tetradic

FF6E3D
6EFF3D
3DCFFF
CF3DFF

Contrast Matrix WCAG 2.1 Contrast

FF6E3D
FF3341
D91818
7D1B1B
380827
—
1.3
Fail
1.8
Fail
3.7
AA Large
6.1
AA
1.3
Fail
—
1.4
Fail
2.8
Fail
4.7
AA
1.8
Fail
1.4
Fail
—
2.0
Fail
3.3
AA Large
3.7
AA Large
2.8
Fail
2.0
Fail
—
1.7
Fail
6.1
AA
4.7
AA
3.3
AA Large
1.7
Fail
—
White BG
2.8Fail
3.6AA Large
5.1AA
10.3AAA
17.0AAA
Black BG
7.5AAA
5.8AA
4.1AA Large
2.0Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C0BF49
A7A53E
858418
53521B
23231F

Deuteranopia

C9D44C
B3C23D
919F18
58601B
262A1E

Tritanopia

F85254
F53B3A
CF1818
781B1B
361A18

Achromatopsia

949494
727272
525252
383838
1A1A1A

Shades & Tints Shades & Tints

#FF6E3D

Dark
Light

#FF3341

Dark
Light

#D91818

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff6e3d;
  --color-2: #ff3341;
  --color-3: #d91818;
  --color-4: #7d1b1b;
  --color-5: #380827;
}

SCSS

$color-1: #ff6e3d;
$color-2: #ff3341;
$color-3: #d91818;
$color-4: #7d1b1b;
$color-5: #380827;

TAILWIND

colors: {
  'brand-1': '#ff6e3d',
  'brand-2': '#ff3341',
  'brand-3': '#d91818',
  'brand-4': '#7d1b1b',
  'brand-5': '#380827',
}

RGB Array

[255, 110, 61], [255, 51, 65], [217, 24, 24], [125, 27, 27], [56, 8, 39]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FF6E3D, #FF3341, #D91818, #7D1B1B, #380827 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #ff6e3d; --color-2: #ff3341; --color-3: #d91818; --color-4: #7d1b1b; --color-5: #380827. 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 nature-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