WGSN x Coloro

2025

#4C5578

Future Dusk

A deep twilight blue-violet that mixes sci-fi edge with quiet luxury.

Generate palettes Visualize in mockups Back to 2025 overview

Copy color values

HEX / RGB / CMYK ready for dev teams.

HEX

#4C5578

RGB

rgb(76, 85, 120)

CMYK

37, 29, 0, 53

Palette ideas

Monochrome, analogous, complementary, and triadic sets.

Monochrome Depth

Light and dark steps around the hero color.

#202332

#383E57

#4C5578

#5F6A95

#838CAF

Analogous Flow

Neighbors on the color wheel for a soft gradient story.

#405864

#4C5E76

#4C5578

#4D4C76

#645889

Complementary Contrast

Opposites that add clarity and focus.

#4C5578

#645C40

#8F855B

#363945

#8A8C93

Triadic Balance

Three evenly spaced hues for versatile layouts.

#4C5578

#764C54

#54764C

#424657

#737A96

Split Complementary

Balanced contrast with two supporting accents.

#4C5578

#76584C

#6A764C

#2F3341

#7D84A1

Export tokens

Copy CSS variables or plug into Tailwind.

#4C5578

CSS Variables

:root {
  --year-base: #4C5578;
  --year-base-contrast: #FFFFFF;
  --year-accent-1: #383E57;
  --year-accent-2: #4C5578;
  --year-accent-3: #5F6A95;
  --year-surface: #f8fafc;
}

Tailwind Config

theme: {
  extend: {
    colors: {
      primary: 'var(--year-base)',
      accent: 'var(--year-accent-1)',
      surface: 'var(--year-surface)',
    },
  },
},

Scenario previews

See the color in UI, posters, and ecommerce layouts.

UI Dashboard

Poster / Social

Launch Campaign

Design with #4C5578

Ecommerce Hero

New Drop · #4C5578-20%

Primary CTA

Secondary

Usage guidance

Summary

A deep twilight blue-violet that mixes sci-fi edge with quiet luxury.

Notes

Use as a grounding shell for dark UI or as a luxe accent on neutrals. Pair with lilac, silver, or muted coral to keep it fresh; ensure light text for accessibility.

Tips