ColorSeed

Complementary · 6 colors · May 24, 2026

Coffee & Rapunzel

Create palette

Coffee & Rapunzel weaves the harmony of colors that speak without contradiction. a warm register that draws and holds — an uncompromising visual dramaturgy. It speaks of clarity, intellect and of stimulating.

ComplementaryGamePrintDarkWarm
#2F1B12Couleur 1
RGB47 27 18HSL19 45 13
#123C54Couleur 2
RGB18 60 84HSL202 65 20
#662E1BCouleur 3
RGB102 46 27HSL15 58 25
#A95D33Couleur 4
RGB169 93 51HSL21 54 43
#DAAE59Couleur 5
RGB218 174 89HSL40 64 60
#F4D781Couleur 6
RGB244 215 129HSL45 84 73

Palette Usage Guide

Application Scenarios

Interface Design

Combine #2f1b12 for text on #f4d781 background.

Emotional Impact

Coffee & Rapunzel weaves the harmony of colors that speak without contradiction. a warm register that draws and holds — an uncompromising visual dramaturgy. It speaks of clarity, intellect and of stimulating.

Contrast Analysis
Text on Canvas

11.6:1

AAA

Secondary on Canvas

3.5:1

AA Large

Accent on Base

3.3:1

AA Large

Convert palette to thread / yarn

Closest matches across major brands

Average ΔE :27 (Approximate)
#2F1B12
DMC 938
Coffee Brown Ul Dk
ΔE 19
#123C54
DMC 311
Navy Blue Med
ΔE 24
#662E1B
DMC 801
Coffee Brown Dk
ΔE 32
#A95D33
DMC 435
Brown Very Light
ΔE 32
#DAAE59
DMC 3820
Straw Dark
ΔE 32
#F4D781
DMC 743
Yellow Medium
ΔE 22

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: #2f1b12;
  --color-couleur-2: #123c54;
  --color-couleur-3: #662e1b;
  --color-couleur-4: #a95d33;
  --color-couleur-5: #daae59;
  --color-couleur-6: #f4d781;
}
Tailwind
'coffee-rapunzel': {
  600: '#2f1b12',
  500: '#123c54',
  400: '#662e1b',
  300: '#a95d33',
  200: '#daae59',
  100: '#f4d781',
}
JSON
{
  "name": "Coffee & Rapunzel",
  "harmony": "Complementary",
  "colors": [
    {
      "name": "Couleur 1",
      "hex": "#2f1b12"
    },
    {
      "name": "Couleur 2",
      "hex": "#123c54"
    },
    {
      "name": "Couleur 3",
      "hex": "#662e1b"
    },
    {
      "name": "Couleur 4",
      "hex": "#a95d33"
    },
    {
      "name": "Couleur 5",
      "hex": "#daae59"
    },
    {
      "name": "Couleur 6",
      "hex": "#f4d781"
    }
  ]
}
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
16.32:1AAA
Black
1.29:1Fail
Couleur 2
White
11.67:1AAA
Black
1.8:1Fail
Couleur 3
White
10.65:1AAA
Black
1.97:1Fail
Couleur 4
White
4.88:1AA
Black
4.3:1AA Large
Couleur 5
White
2.06:1Fail
Black
10.18:1AAA
Couleur 6
White
1.41:1Fail
Black
14.88:1AAA
Brand Design

Identity Visuals

Icon Application
Typography Pairing

Coffee & Rapunzel

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

Authority & Mastery

Couleur 1 is a deep, balanced red that commands a direct, assertive presence. Its depth lends the gravity of brands that have nothing to justify — quiet power, total assurance.

AuthorityDepthPrestigeGravity
Couleur 2

Innovation & Precision

Couleur 2 is a dark, rich cyan positioned midway between blue's analytical rigor and green's vitality. This intermediate position gives it an image of technical modernity and operational precision — prized in tech, health, and fintech.

InnovationPrecisionModernityTech
Couleur 3

Authority & Mastery

Couleur 3 is a dark, balanced red that evokes a direct, assertive presence. Its depth lends the gravity of brands that have nothing to justify — quiet power, total assurance.

AuthorityDepthPrestigeGravity
Couleur 4

Authenticity & Grounding

Couleur 4 evokes the medium, balanced warmth of fired clay — a shade that is both reassuring and memorable. It evokes craftsmanship, raw materials, and tradition. Brands that adopt it communicate authenticity effortlessly.

AuthenticityCraftGroundingTradition
Couleur 5

Enthusiasm & Boldness

Couleur 5 is a light orange with rich saturation that evokes 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 6

Enthusiasm & Boldness

Couleur 6 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
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 →