# Yellow and crimson summer palette

The Yellow and crimson summer palette brings together pale yellow, gold, orange, and red. The colors span a moderate lightness range, combining strong color with gentle contrast. Its light and open character suits seasonal campaigns and event graphics. Its darkest tone is red, and its lightest tone is pale yellow.

- Also called: Warm beige, yellow, orange and red angular swatches
- Seed: `kU6iRK7T2_FvIuhR0Dxg`
- Page: https://grabient.com/kU6iRK7T2_FvIuhR0Dxg?style=angularSwatches&steps=4&angle=135
- Drawn as: angular swatches, 4 steps, 135 degrees
- Kinds: vivid, neon, warm, multicolor
- Hues: analogous
- Contrast of its darkest and lightest colors: 2.9 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 | `#e9e7c2` | `oklch(92.13% 0.0496 104.77)` | More Mint | black, 16.7 to 1 |
| 2 | `#efd026` | `oklch(85.83% 0.1695 97.37)` | Giallo | black, 13.7 to 1 |
| 3 | `#ff781d` | `oklch(72.05% 0.1879 47.70)` | Royal Oranje | black, 7.9 to 1 |
| 4 | `#f53a57` | `oklch(64.17% 0.2205 18.11)` | Flowerhorn Cichlid Red | black, 5.6 to 1 |

## CSS

```css
background: conic-gradient(from 135deg, #e9e7c2 0.000% 25.000%, #efd026 25.000% 50.000%, #ff781d 50.000% 75.000%, #f53a57 75.000% 100.000%);
background: conic-gradient(from 135deg, oklch(92.13% 0.0496 104.77) 0.000% 25.000%, oklch(85.83% 0.1695 97.37) 25.000% 50.000%, oklch(72.05% 0.1879 47.70) 50.000% 75.000%, oklch(64.17% 0.2205 18.11) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.921 | 0.05 | 104.8 |
| 2 | 0.858 | 0.169 | 97.4 |
| 3 | 0.72 | 0.2 | 47.7 |
| 4 | 0.642 | 0.22 | 18.1 |

## In these collections

- [Summer swatches](https://grabient.com/summer-swatches)

## Other forms

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