# Crimson and orange wgsn 2027 palette

The Crimson and orange wgsn 2027 palette brings together red, green, orange, blue, and magenta. The colors span a moderate lightness range, combining strong color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is magenta.

- Also called: Brown, orange, blue and pink angular swatches
- Seed: `kWiUESUrpNllItKsxS7XMVKg`
- Page: https://grabient.com/kWiUESUrpNllItKsxS7XMVKg?style=angularSwatches&steps=5&angle=225
- Drawn as: angular swatches, 5 steps, 225 degrees
- Kinds: vivid, multicolor
- Hues: triadic
- Contrast of its darkest and lightest colors: 4.4 to 1

## Colors

The name most people give each color, and the text color that reads on it with its contrast.

| Stop | Hex | OKLCH | Name | Text on it |
| --- | --- | --- | --- | --- |
| 1 | `#9c5953` | `oklch(53.94% 0.0896 25.31)` | Walleye | white, 5.3 to 1 |
| 2 | `#52a641` | `oklch(64.96% 0.1598 140.50)` | Mid Green | black, 6.8 to 1 |
| 3 | `#fe6b00` | `oklch(70.08% 0.1991 45.37)` | Spooky Tangerine | black, 7.3 to 1 |
| 4 | `#003286` | `oklch(35.05% 0.1485 260.67)` | One Minute to Midnight | white, 11.6 to 1 |
| 5 | `#fb6db7` | `oklch(72.83% 0.1902 350.44)` | Fěn Hóng Pink | black, 7.9 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #9c5953 0.000% 20.000%, #52a641 20.000% 40.000%, #fe6b00 40.000% 60.000%, #003286 60.000% 80.000%, #fb6db7 80.000% 100.000%);
background: conic-gradient(from 225deg, oklch(53.94% 0.0896 25.31) 0.000% 20.000%, oklch(64.96% 0.1598 140.50) 20.000% 40.000%, oklch(70.08% 0.1991 45.37) 40.000% 60.000%, oklch(35.05% 0.1485 260.67) 60.000% 80.000%, oklch(72.83% 0.1902 350.44) 80.000% 100.000%);
```

## Keyframes

5 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees.

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.539 | 0.09 | 25.3 |
| 2 | 0.65 | 0.16 | 140.5 |
| 3 | 0.701 | 0.2 | 45.4 |
| 4 | 0.35 | 0.19 | -99.4 |
| 5 | 0.728 | 0.19 | -9.6 |

## In these collections

- [WGSN 2027 swatches](https://grabient.com/wgsn-2027-swatches)

## Other forms

- [JSON](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.json?style=angularSwatches&steps=5&angle=225)
- [PNG](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.png?style=angularSwatches&steps=5&angle=225)
- [SVG](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.svg?style=angularSwatches&steps=5&angle=225)
- [CSS](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.css?style=angularSwatches&steps=5&angle=225)
- [ASE](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.ase?style=angularSwatches&steps=5&angle=225)
- [GPL](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.gpl?style=angularSwatches&steps=5&angle=225)
- [GRD](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.grd?style=angularSwatches&steps=5&angle=225)
- [Design tokens](https://grabient.com/kWiUESUrpNllItKsxS7XMVKg.tokens.json?style=angularSwatches&steps=5&angle=225)
- [Social card](https://grabient.com/api/og?seed=kWiUESUrpNllItKsxS7XMVKg&style=angularSwatches&steps=5&angle=225)
- [Palettes like this one](https://grabient.com/palettes?q=kWiUESUrpNllItKsxS7XMVKg)
- [Guide for agents](https://grabient.com/llms.txt)