duotone-treatment

name	duotone-treatment
description	Use when stylizing photography for graphic posters or editorial covers. Duotone (two-color mapping) creates striking brand-aligned imagery.

Duotone Treatment

Duotone: map photo's luminance range to two colors (highlight + shadow). Spotify covers, NYT graphics use this. Distinctive brand signal.

Implementation in CSS

.duotone-photo {
  filter: grayscale(1) contrast(1.2);
  background-blend-mode: multiply;
  background: linear-gradient(to bottom right, #e85d2c, #0d0807);
}

For better control, use SVG filter or image editor for permanent treatment.

Duotone color pairs

Mood	Highlight	Shadow
Warm editorial	Cream	Ink
CardPrepAI orange	Light orange	Deep ink
X3FS blue	Light blue	Navy
FDG teal	Light teal	Deep teal
Premium	Gold	Black
Cool	Light blue-grey	Charcoal

When to use duotone

1. Hero photography (statement piece)
2. Section header images
3. Social media graphics
4. Print materials (when ink colors are limited)
5. Brand poster series

Don't use:

• All photos on a page (too uniform)
• Photos with subtle color stories (loses information)
• People photography (uncomfortable skin tone)

Where this fits in the X3 empire

Used in CardPrepAI for brand-signal photography moments.