# Gold, cobalt blue and orange summer palette

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

- Also called: Yellow, light blue, pink and peach angular swatches
- Seed: `kW7FREa5hL88txlZNMz7ZrFQ`
- Page: https://grabient.com/kW7FREa5hL88txlZNMz7ZrFQ?style=angularSwatches&steps=5&angle=45
- Drawn as: angular swatches, 5 steps, 45 degrees
- Kinds: dark center, pastel
- Hues: split-complementary
- 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 | `#ffe88b` | `oklch(92.91% 0.1157 95.62)` | Quack Quack | black, 17.1 to 1 |
| 2 | `#99dbdb` | `oklch(84.65% 0.0661 197.07)` | Blue Tint | black, 13.4 to 1 |
| 3 | `#478acf` | `oklch(62.20% 0.1254 250.97)` | Blue Sonki | black, 5.8 to 1 |
| 4 | `#e67599` | `oklch(70.08% 0.1447 0.87)` | Embarrassed | black, 7.3 to 1 |
| 5 | `#fbc4aa` | `oklch(86.22% 0.0730 46.31)` | Gadabout | black, 13.5 to 1 |

## CSS

```css
background: conic-gradient(from 45deg, #ffe88b 0.000% 20.000%, #99dbdb 20.000% 40.000%, #478acf 40.000% 60.000%, #e67599 60.000% 80.000%, #fbc4aa 80.000% 100.000%);
background: conic-gradient(from 45deg, oklch(92.91% 0.1157 95.62) 0.000% 20.000%, oklch(84.65% 0.0661 197.07) 20.000% 40.000%, oklch(62.20% 0.1254 250.97) 40.000% 60.000%, oklch(70.08% 0.1447 0.87) 60.000% 80.000%, oklch(86.22% 0.0730 46.31) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.929 | 0.116 | 95.6 |
| 2 | 0.846 | 0.066 | 197.1 |
| 3 | 0.622 | 0.125 | 251 |
| 4 | 0.701 | 0.145 | 360.9 |
| 5 | 0.862 | 0.073 | 406.3 |

## In these collections

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

## Other forms

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