# Yellow and Blue: Ochre and pale aqua

The "Yellow and Blue: Ochre and pale aqua" palette brings together gold, off-white, and blue. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits brand mood boards and editorial graphics. Its darkest tone is blue, and its lightest tone is off-white.

- Also called: Yellow, white and blue linear gradient
- Seed: `kSymw__AbMLw8yC`
- Page: https://grabient.com/kSymw__AbMLw8yC?steps=32&angle=135
- Drawn as: linear gradient, 32 steps, 135 degrees
- Kinds: light center, pastel, light
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 6.7 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 | `#e2b631` | `oklch(79.53% 0.1488 89.30)` | Last Sunlight | black, 11 to 1 |
| 2 | `#debc3f` | `oklch(80.32% 0.1435 93.12)` | Solarium | black, 11.3 to 1 |
| 3 | `#dac34f` | `oklch(81.47% 0.1363 97.84)` | Pepperoncini | black, 11.8 to 1 |
| 4 | `#d6cb61` | `oklch(82.93% 0.1275 103.33)` | Quince | black, 12.5 to 1 |
| 5 | `#d2d375` | `oklch(84.61% 0.1174 109.50)` | Green Gecko | black, 13.3 to 1 |
| 6 | `#cedc89` | `oklch(86.44% 0.1064 116.23)` | Lime Ice | black, 14.1 to 1 |
| 7 | `#cce49e` | `oklch(88.37% 0.0948 123.41)` | Field Day | black, 15.1 to 1 |
| 8 | `#ccebb1` | `oklch(90.31% 0.0829 130.93)` | Imbued With Mint | black, 16 to 1 |
| 9 | `#cef1c4` | `oklch(92.20% 0.0711 138.67)` | Maroccan Tea | black, 17 to 1 |
| 10 | `#d2f7d4` | `oklch(93.96% 0.0597 146.53)` | Light Carolina | black, 17.9 to 1 |
| 11 | `#d8fbe2` | `oklch(95.53% 0.0490 154.40)` | Misty Lawn | black, 18.7 to 1 |
| 12 | `#defded` | `oklch(96.85% 0.0394 162.17)` | Crystal Glass | black, 19.4 to 1 |
| 13 | `#e5fff5` | `oklch(97.82% 0.0304 169.73)` | Mint Chiffon | black, 19.9 to 1 |
| 14 | `#ebfff9` | `oklch(98.40% 0.0218 176.97)` | Placebo Turquoise | black, 20.2 to 1 |
| 15 | `#ecfffb` | `oklch(98.51% 0.0201 183.73)` | Aphrodite’s Pearls | black, 20.2 to 1 |
| 16 | `#ecfdfb` | `oklch(98.08% 0.0180 189.98)` | Cold White | black, 19.9 to 1 |
| 17 | `#e8f9f9` | `oklch(97.02% 0.0186 195.65)` | Calm Waters | black, 19.3 to 1 |
| 18 | `#dff4f5` | `oklch(95.25% 0.0219 201.24)` | Bone-Chilling | black, 18.4 to 1 |
| 19 | `#d3edf1` | `oklch(92.85% 0.0277 206.79)` | Sparkling River | black, 17.1 to 1 |
| 20 | `#c4e4ec` | `oklch(89.90% 0.0355 212.27)` | Surf’s Up | black, 15.7 to 1 |
| 21 | `#b2dbe6` | `oklch(86.51% 0.0451 217.67)` | Blue Shimmer | black, 14.1 to 1 |
| 22 | `#9fcfe1` | `oklch(82.77% 0.0561 222.94)` | Light Sky Babe | black, 12.5 to 1 |
| 23 | `#8bc3dd` | `oklch(78.77% 0.0681 228.06)` | Club Cruise | black, 10.9 to 1 |
| 24 | `#77b6d8` | `oklch(74.62% 0.0809 233.00)` | Water Fountain | black, 9.4 to 1 |
| 25 | `#64a8d3` | `oklch(70.41% 0.0940 237.73)` | Salem Blue | black, 8.1 to 1 |
| 26 | `#529acf` | `oklch(66.23% 0.1071 242.23)` | Blue Iguana | black, 6.9 to 1 |
| 27 | `#428cca` | `oklch(62.18% 0.1199 246.46)` | Magical Merlin | black, 5.8 to 1 |
| 28 | `#347fc6` | `oklch(58.36% 0.1320 250.39)` | Eye Blue | black, 4.9 to 1 |
| 29 | `#2b72c2` | `oklch(54.86% 0.1431 254.01)` | Palace Blue | white, 4.9 to 1 |
| 30 | `#2566be` | `oklch(51.78% 0.1528 257.26)` | Blue Streak | white, 5.6 to 1 |
| 31 | `#235cba` | `oklch(49.21% 0.1608 260.14)` | Amnesia Blue | white, 6.3 to 1 |
| 32 | `#2453b7` | `oklch(47.24% 0.1667 262.60)` | Cerulean Blue | white, 6.9 to 1 |

## CSS

```css
background: linear-gradient(135deg, #e2b631 0.0%, #debc3f 3.2%, #dac34f 6.5%, #d6cb61 9.7%, #d2d375 12.9%, #cedc89 16.1%, #cce49e 19.4%, #ccebb1 22.6%, #cef1c4 25.8%, #d2f7d4 29.0%, #d8fbe2 32.3%, #defded 35.5%, #e5fff5 38.7%, #ebfff9 41.9%, #ecfffb 45.2%, #ecfdfb 48.4%, #e8f9f9 51.6%, #dff4f5 54.8%, #d3edf1 58.1%, #c4e4ec 61.3%, #b2dbe6 64.5%, #9fcfe1 67.7%, #8bc3dd 71.0%, #77b6d8 74.2%, #64a8d3 77.4%, #529acf 80.6%, #428cca 83.9%, #347fc6 87.1%, #2b72c2 90.3%, #2566be 93.5%, #235cba 96.8%, #2453b7 100.0%);
background: linear-gradient(135deg in oklch, oklch(79.53% 0.1488 89.30) 0.0%, oklch(80.32% 0.1435 93.12) 3.2%, oklch(81.47% 0.1363 97.84) 6.5%, oklch(82.93% 0.1275 103.33) 9.7%, oklch(84.61% 0.1174 109.50) 12.9%, oklch(86.44% 0.1064 116.23) 16.1%, oklch(88.37% 0.0948 123.41) 19.4%, oklch(90.31% 0.0829 130.93) 22.6%, oklch(92.20% 0.0711 138.67) 25.8%, oklch(93.96% 0.0597 146.53) 29.0%, oklch(95.53% 0.0490 154.40) 32.3%, oklch(96.85% 0.0394 162.17) 35.5%, oklch(97.82% 0.0304 169.73) 38.7%, oklch(98.40% 0.0218 176.97) 41.9%, oklch(98.51% 0.0201 183.73) 45.2%, oklch(98.08% 0.0180 189.98) 48.4%, oklch(97.02% 0.0186 195.65) 51.6%, oklch(95.25% 0.0219 201.24) 54.8%, oklch(92.85% 0.0277 206.79) 58.1%, oklch(89.90% 0.0355 212.27) 61.3%, oklch(86.51% 0.0451 217.67) 64.5%, oklch(82.77% 0.0561 222.94) 67.7%, oklch(78.77% 0.0681 228.06) 71.0%, oklch(74.62% 0.0809 233.00) 74.2%, oklch(70.41% 0.0940 237.73) 77.4%, oklch(66.23% 0.1071 242.23) 80.6%, oklch(62.18% 0.1199 246.46) 83.9%, oklch(58.36% 0.1320 250.39) 87.1%, oklch(54.86% 0.1431 254.01) 90.3%, oklch(51.78% 0.1528 257.26) 93.5%, oklch(49.21% 0.1608 260.14) 96.8%, oklch(47.24% 0.1667 262.60) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.795 | 0.149 | 89.3 |
| 2 | 0.976 | 0.018 | 192.9 |
| 3 | 0.472 | 0.167 | 262.6 |

## In these collections

- [Yellow and blue gradients](https://grabient.com/yellow-and-blue-gradients)

## Other forms

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