Monochromatic · 5 colors · May 1, 2026

Yellow & 24

Yellow & 24 — a soft drift between neighboring hues on the wheel. The palette develops a warm, enveloping sensuality and establishes a dramatic tension that commands attention. A chromatic vocabulary for clarity and intellect.

MonochromaticGame Warm Dark Monochrome

#FFDC83Couleur 1

RGB255 220 131HSL43 100 76

#DDC485Couleur 2

RGB221 196 133HSL43 56 69

#9A7800Couleur 3

RGB154 120 0HSL47 100 30

#403500Couleur 4

RGB64 53 0HSL50 100 13

#262100Couleur 5

RGB38 33 0HSL52 100 7

✦Palette Usage Guide

Application Scenarios

Interface Design

Combine #262100 for text on #ffdc83 background.

Emotional Impact

Contrast Analysis

Text on Canvas

12.2:1

AAA

Secondary on Canvas

3.1:1

AA Large

Accent on Base

3.9:1

AA Large

Convert palette to thread / yarn

Closest matches across major brands

Brand :

Average ΔE :41 (Approximate)

#FFDC83

DMC 744

Yellow Pale

ΔE 13

#DDC485

DMC 738

Tan Very Light

ΔE 42

#9A7800

DMC 435

Brown Very Light

ΔE 74

#403500

DMC 898

Coffee Brown V Dk

ΔE 49

#262100

DMC 938

Coffee Brown Ul Dk

ΔE 26

Approximate sRGB matches — request a physical color card from each brand before purchasing.

Technical Specs

Developer Assets

Developer handoff assets with copyable code blocks for design systems.

CSS

:root {
  --color-couleur-1: #ffdc83;
  --color-couleur-2: #ddc485;
  --color-couleur-3: #9a7800;
  --color-couleur-4: #403500;
  --color-couleur-5: #262100;
}

Tailwind

'yellow-24': {
  500: '#ffdc83',
  400: '#ddc485',
  300: '#9a7800',
  200: '#403500',
  100: '#262100',
}

JSON

{
  "name": "Yellow & 24",
  "harmony": "Monochromatic",
  "colors": [
    {
      "name": "Couleur 1",
      "hex": "#ffdc83"
    },
    {
      "name": "Couleur 2",
      "hex": "#ddc485"
    },
    {
      "name": "Couleur 3",
      "hex": "#9a7800"
    },
    {
      "name": "Couleur 4",
      "hex": "#403500"
    },
    {
      "name": "Couleur 5",
      "hex": "#262100"
    }
  ]
}

Export Image

Design Tokens

Design Tokens Export

W3C, Figma and Tokens Studio compatible. Direct integration into your design workflow.

Go Pro

Accessibility

Contrast Ratios

Each color vs. white background

Couleur 1

White

1.33:1Fail

Black

15.82:1AAA

Couleur 2

White

1.71:1Fail

Black

12.31:1AAA

Couleur 3

White

4.15:1AA Large

Black

5.06:1AA

Couleur 4

White

12.16:1AAA

Black

1.73:1Fail

Couleur 5

White

16.15:1AAA

Black

1.3:1Fail

Brand Design

Identity Visuals

Icon Application

Typography Pairing

Yellow & 24

The intersection of form and function reveals the palette in all its depth. Every hue is intentional, every space is a breath.

— · Display— · Body

UI Components

Buttons

Active

Surface Card

System element

Emotional Resonance

Color Psychology

Couleur 1

Enthusiasm & Boldness

Couleur 1 is a pale orange with vivid saturation that radiates positive, communicative energy. Its chromatic intensity holds the eye without aggression and stimulates decision-making — the tool of brands that want to stand out.

EnthusiasmOptimismEnergyImpact

Couleur 2

Creativity & Accessibility

Couleur 2 is a light orange with balanced saturation that breathes positive, communicative energy. Softened, it preserves orange's vitality without its impetuosity — ideal for brands wanting to appear both inventive and warm.

CreativityAccessibilityFriendlinessOpenness

Couleur 3

Enthusiasm & Boldness

Couleur 3 is a dark orange with vivid saturation that commands positive, communicative energy. Its chromatic intensity holds the eye without aggression and stimulates decision-making — the tool of brands that want to stand out.

EnthusiasmOptimismEnergyImpact

Couleur 4

Enthusiasm & Boldness

Couleur 4 is a deep orange with vivid saturation that commands positive, communicative energy. Its chromatic intensity holds the eye without aggression and stimulates decision-making — the tool of brands that want to stand out.

EnthusiasmOptimismEnergyImpact

Couleur 5

Enthusiasm & Boldness

Couleur 5 is a deep orange with vivid saturation that commands positive, communicative energy. Its chromatic intensity holds the eye without aggression and stimulates decision-making — the tool of brands that want to stand out.

EnthusiasmOptimismEnergyImpact

Visual Atmosphere

Moodboard

No images found

Export

Brand PDF

Premium Brand Guidelines document with palette, color psychology and moodboard.

PDF Brand Identity Export

7 premium pages: Cover · Palette · Detail · Typography · Usage Guide

Go Pro

Create your own palette on ColorSeed →