# DIY Bullseye palette

The DIY Bullseye palette brings together dark blue, teal, gold, and red. The colors span a broad lightness range, combining strong color with clear contrast. Its bold and dramatic character suits poster layouts and editorial spreads. Its darkest tone is dark blue, and its lightest tone is gold.

- Also called: Navy, green, yellow and red linear swatches
- Seed: `kUPySxVSg6267MzQR7gA`
- Page: https://grabient.com/kUPySxVSg6267MzQR7gA?style=linearSwatches&angle=160
- Drawn as: linear swatches, 7 steps, 160 degrees
- Kinds: light center, vivid, multicolor
- Hues: two-hue
- Contrast of its darkest and lightest colors: 10.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 | `#0c2338` | `oklch(24.80% 0.0496 248.91)` | Celestial Canvas | white, 16 to 1 |
| 2 | `#205b78` | `oklch(44.61% 0.0766 233.98)` | Saltwater Denim | white, 7.4 to 1 |
| 3 | `#1aa8b6` | `oklch(66.93% 0.1102 205.58)` | Bluebird | black, 7.3 to 1 |
| 4 | `#73db96` | `oklch(81.10% 0.1381 153.14)` | Aurora Green | black, 12.3 to 1 |
| 5 | `#f1d43d` | `oklch(87.01% 0.1626 97.79)` | Giallo | black, 14.2 to 1 |
| 6 | `#ff932d` | `oklch(76.25% 0.1677 57.77)` | Energy Orange | black, 9.4 to 1 |
| 7 | `#e84b34` | `oklch(62.99% 0.1970 31.22)` | Tomato Curry | black, 5.4 to 1 |

## CSS

```css
background: linear-gradient(160deg, #0c2338 0.000% 14.286%, #205b78 14.286% 28.571%, #1aa8b6 28.571% 42.857%, #73db96 42.857% 57.143%, #f1d43d 57.143% 71.429%, #ff932d 71.429% 85.714%, #e84b34 85.714% 100.000%);
background: linear-gradient(160deg, oklch(24.80% 0.0496 248.91) 0.000% 14.286%, oklch(44.61% 0.0766 233.98) 14.286% 28.571%, oklch(66.93% 0.1102 205.58) 28.571% 42.857%, oklch(81.10% 0.1381 153.14) 42.857% 57.143%, oklch(87.01% 0.1626 97.79) 57.143% 71.429%, oklch(76.25% 0.1677 57.77) 71.429% 85.714%, oklch(62.99% 0.1970 31.22) 85.714% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.248 | 0.05 | 248.9 |
| 2 | 0.669 | 0.11 | 205.6 |
| 3 | 0.87 | 0.163 | 97.8 |
| 4 | 0.63 | 0.197 | 31.2 |

## In these collections

- [Zine colors](https://grabient.com/zine-colors)

## Other forms

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