ColorSeed

Complementary · 5 colors · May 10, 2026

Back to the future

Create palette

Through the perfect balance of opposites — each one revealing the other, Back to the future composes an elegant and restrained refinement. The contrast between hues evokes growth, vitality.

ComplementaryPrintFashionPastelNature
#3C3E54Couleur 1
RGB60 62 84HSL235 17 28
#E96738Couleur 2
RGB233 103 56HSL16 80 57
#BCA994Couleur 3
RGB188 169 148HSL31 23 66
#F3EBDACouleur 4
RGB243 235 218HSL41 51 90
#FAF7F3Couleur 5
RGB250 247 243HSL34 41 97

Palette Usage Guide

Application Scenarios

Interface Design

Combine #3c3e54 for text on #faf7f3 background.

Emotional Impact

Through the perfect balance of opposites — each one revealing the other, Back to the future composes an elegant and restrained refinement. The contrast between hues evokes growth, vitality.

Contrast Analysis
Text on Canvas

9.8:1

AAA

Secondary on Canvas

2.1:1

Fail

Accent on Base

4.6:1

AA

Convert palette to thread / yarn

Closest matches across major brands

Average ΔE :29 (Approximate)
#3C3E54
DMC 311
Navy Blue Med
ΔE 49
#E96738
DMC 947
Burnt Orange
ΔE 23
#BCA994
DMC 318
Steel Gray Light
ΔE 56
#F3EBDA
DMC ECRU
Ecru
ΔE 7
#FAF7F3
DMC 3865
Winter White
ΔE 10

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: #3c3e54;
  --color-couleur-2: #e96738;
  --color-couleur-3: #bca994;
  --color-couleur-4: #f3ebda;
  --color-couleur-5: #faf7f3;
}
Tailwind
'back-to-the-future': {
  500: '#3c3e54',
  400: '#e96738',
  300: '#bca994',
  200: '#f3ebda',
  100: '#faf7f3',
}
JSON
{
  "name": "Back to the future",
  "harmony": "Complementary",
  "colors": [
    {
      "name": "Couleur 1",
      "hex": "#3c3e54"
    },
    {
      "name": "Couleur 2",
      "hex": "#e96738"
    },
    {
      "name": "Couleur 3",
      "hex": "#bca994"
    },
    {
      "name": "Couleur 4",
      "hex": "#f3ebda"
    },
    {
      "name": "Couleur 5",
      "hex": "#faf7f3"
    }
  ]
}
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
10.45:1AAA
Black
2.01:1Fail
Couleur 2
White
3.25:1AA Large
Black
6.46:1AA
Couleur 3
White
2.27:1Fail
Black
9.24:1AAA
Couleur 4
White
1.19:1Fail
Black
17.71:1AAA
Couleur 5
White
1.07:1Fail
Black
19.66:1AAA
Brand Design

Identity Visuals

Icon Application
Typography Pairing

Back to the future

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

Trust & Authority

Couleur 1 anchors the dark, muted register of blue — the universal color of trust, here expressed with its own personality. Its depth makes it the color of institutions, decision-makers, and leaders who have nothing to prove. Serious, stable, timeless.

TrustAuthorityStabilityPrestige
Couleur 2

Energy & Urgency

Couleur 2 is a light, vivid red that evokes a direct, assertive presence. Its saturation level makes it an immediate visual signal: ideal for CTAs, conversion moments, and decisive instants.

ActionUrgencyEnergyVitality
Couleur 3

Warmth & Benevolence

Couleur 3 whispers the light, quiet warmth of fired clay — a shade that is both reassuring and memorable. In its lighter tones, it sheds the heaviness of saturated orange to gain accessibility and human closeness.

ClosenessWarmthBenevolenceLifestyle
Couleur 4

Creativity & Accessibility

Couleur 4 is a pale 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 5

Warmth & Benevolence

Couleur 5 breathes the pale, balanced warmth of fired clay — a shade that is both reassuring and memorable. In its lighter tones, it sheds the heaviness of saturated orange to gain accessibility and human closeness.

ClosenessWarmthBenevolenceLifestyle
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 →