← Back to Editor

#75B103 · #99CC34 · #E0DECF · #FF6102 · #D24A16

pastel

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustrationData Visualization

Color Details Color Details

#75B103

Grass Green · Olive · Forest Green

HEX
#75B103
RGB
rgb(117, 177, 3)
HSL
hsl(81, 97%, 35%)
HSB
hsb(81, 98%, 69%)
CMYK
cmyk(34%, 0%, 98%, 31%)
Oklch
oklch(69.3% 0.185 129.8)

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

#99CC34

Grass Green · GreenYellow · Olive Green

HEX
#99CC34
RGB
rgb(153, 204, 52)
HSL
hsl(80, 60%, 50%)
HSB
hsb(80, 75%, 80%)
CMYK
cmyk(25%, 0%, 75%, 20%)
Oklch
oklch(78.2% 0.182 126.8)

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

#E0DECF

Fresh Green · LightGray · Lemon Cream

HEX
#E0DECF
RGB
rgb(224, 222, 207)
HSL
hsl(53, 22%, 85%)
HSB
hsb(53, 8%, 88%)
CMYK
cmyk(0%, 1%, 8%, 12%)
Oklch
oklch(89.8% 0.020 100.6)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#FF6102

Tangerine · OrangeRed · Amber Brown

HEX
#FF6102
RGB
rgb(255, 97, 2)
HSL
hsl(23, 100%, 50%)
HSB
hsb(23, 99%, 100%)
CMYK
cmyk(0%, 62%, 99%, 0%)
Oklch
oklch(69.0% 0.208 41.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#D24A16

Tangerine · Chocolate · Amber Brown

HEX
#D24A16
RGB
rgb(210, 74, 22)
HSL
hsl(17, 81%, 45%)
HSB
hsb(17, 90%, 82%)
CMYK
cmyk(0%, 65%, 90%, 18%)
Oklch
oklch(59.1% 0.181 38.4)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

75B103
3F03B0

Analogous

B09603
75B103
1DB003

Triadic

75B103
0373B0
B00373

Split-Comp.

75B103
031DB0
9603B0

Tetradic

75B103
03B096
3F03B0
B0031D

Contrast Matrix WCAG 2.1 Contrast

75B103
99CC34
E0DECF
FF6102
D24A16
—
1.4
Fail
1.9
Fail
1.2
Fail
1.7
Fail
1.4
Fail
—
1.4
Fail
1.6
Fail
2.3
Fail
1.9
Fail
1.4
Fail
—
2.2
Fail
3.3
AA Large
1.2
Fail
1.6
Fail
2.2
Fail
—
1.5
Fail
1.7
Fail
2.3
Fail
3.3
AA Large
1.5
Fail
—
White BG
2.6Fail
1.9Fail
1.4Fail
3.0AA Large
4.4AA Large
Black BG
8.0AAA
11.0AAA
15.5AAA
7.0AA
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F902D
AFB059
DFDFD3
BBB919
979623

Deuteranopia

8C8737
ACA862
DFDFD3
C4D01E
9FA926

Tritanopia

784E56
9C767C
E0D5D6
F72B2F
CB2D2F

Achromatopsia

8B8B8B
ABABAB
DDDDDD
858585
6D6D6D

Shades & Tints Shades & Tints

#75B103

Dark
Light

#99CC34

Dark
Light

#E0DECF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #75b103;
  --color-2: #99cc34;
  --color-3: #e0decf;
  --color-4: #ff6102;
  --color-5: #d24a16;
}

SCSS

$color-1: #75b103;
$color-2: #99cc34;
$color-3: #e0decf;
$color-4: #ff6102;
$color-5: #d24a16;

TAILWIND

colors: {
  'brand-1': '#75b103',
  'brand-2': '#99cc34',
  'brand-3': '#e0decf',
  'brand-4': '#ff6102',
  'brand-5': '#d24a16',
}

RGB Array

[117, 177, 3], [153, 204, 52], [224, 222, 207], [255, 97, 2], [210, 74, 22]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #75B103, #99CC34, #E0DECF, #FF6102, #D24A16 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: #75b103; --color-2: #99cc34; --color-3: #e0decf; --color-4: #ff6102; --color-5: #d24a16. 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 pastel-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