# Blue and gold color palette

The Blue and gold color palette brings together dark blue, gray, and light orange. The colors span a broad lightness range, combining moderate color with clear contrast. Its balanced and composed character suits stationery systems and print layouts. Its darkest tone is dark blue, and its lightest tone is light orange.

- Also called: Navy, tan, gray and dark gray radial gradient
- Seed: `kWTB2uRgM__AkrRCAz_oAzTY`
- Page: https://grabient.com/kWTB2uRgM__AkrRCAz_oAzTY?style=radialGradient&steps=48&angle=0
- Drawn as: radial gradient, 48 steps, 0 degrees
- Kinds: light center, muted
- Hues: complementary
- Contrast of its darkest and lightest colors: 11.1 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 | `#1c3040` | `oklch(29.92% 0.0400 244.69)` | Imperial Primer | white, 13.6 to 1 |
| 2 | `#203343` | `oklch(31.14% 0.0380 245.22)` | Blue Whale | white, 13 to 1 |
| 3 | `#263646` | `oklch(32.64% 0.0349 246.61)` | Tahitian Pearl | white, 12.3 to 1 |
| 4 | `#2c3a49` | `oklch(34.38% 0.0311 248.56)` | Ship’s Officer | white, 11.5 to 1 |
| 5 | `#343f4c` | `oklch(36.33% 0.0268 250.79)` | Deepsea Core | white, 10.6 to 1 |
| 6 | `#3b454f` | `oklch(38.46% 0.0222 252.99)` | Boeing Blue | white, 9.8 to 1 |
| 7 | `#434a53` | `oklch(40.74% 0.0178 254.87)` | Sea Mariner | white, 8.9 to 1 |
| 8 | `#4b5158` | `oklch(43.14% 0.0137 256.13)` | Seared Grey | white, 8 to 1 |
| 9 | `#53575d` | `oklch(45.62% 0.0103 256.49)` | Edge of Black | white, 7.2 to 1 |
| 10 | `#5b5e62` | `oklch(48.15% 0.0078 255.64)` | Glazed Granite | white, 6.4 to 1 |
| 11 | `#636569` | `oklch(50.70% 0.0066 253.29)` | Grey Web | white, 5.8 to 1 |
| 12 | `#696d70` | `oklch(53.24% 0.0069 249.15)` | Beautiful Darkness | white, 5.2 to 1 |
| 13 | `#6f7479` | `oklch(55.76% 0.0090 242.88)` | Raven Grey | white, 4.6 to 1 |
| 14 | `#757e83` | `oklch(58.65% 0.0138 233.68)` | Downing Slate | black, 5 to 1 |
| 15 | `#79898f` | `oklch(61.99% 0.0209 221.75)` | Academy Grey | black, 5.8 to 1 |
| 16 | `#7c979a` | `oklch(65.61% 0.0299 207.68)` | Soul Quenching | black, 6.7 to 1 |
| 17 | `#80a5a3` | `oklch(69.39% 0.0402 192.07)` | Venus Teal | black, 7.8 to 1 |
| 18 | `#87b3a7` | `oklch(73.18% 0.0512 175.49)` | Silicate Green | black, 9 to 1 |
| 19 | `#92c0a5` | `oklch(76.84% 0.0624 158.54)` | Spearmint Frosting | black, 10.3 to 1 |
| 20 | `#a4cb9f` | `oklch(80.22% 0.0731 141.82)` | Limestoned | black, 11.6 to 1 |
| 21 | `#bad297` | `oklch(83.18% 0.0828 125.90)` | Spring Has Sprung | black, 12.7 to 1 |
| 22 | `#d1d690` | `oklch(85.58% 0.0909 111.39)` | Golden Delicious | black, 13.7 to 1 |
| 23 | `#e5d78b` | `oklch(87.28% 0.0969 98.87)` | Impetuous | black, 14.3 to 1 |
| 24 | `#f3d589` | `oklch(88.13% 0.1002 88.93)` | Sprouted | black, 14.6 to 1 |
| 25 | `#f9d18a` | `oklch(87.99% 0.1002 81.86)` | Light Ginger Yellow | black, 14.5 to 1 |
| 26 | `#f9cc8a` | `oklch(86.86% 0.0969 76.20)` | Elven Beige | black, 13.9 to 1 |
| 27 | `#f3c48b` | `oklch(84.88% 0.0910 71.66)` | Ginger Root Peel | black, 13 to 1 |
| 28 | `#e9bb8a` | `oklch(82.19% 0.0830 68.27)` | Gold Vessel | black, 11.9 to 1 |
| 29 | `#dbb188` | `oklch(78.94% 0.0733 66.03)` | Sheepskin | black, 10.7 to 1 |
| 30 | `#cba785` | `oklch(75.27% 0.0627 64.95)` | Totally Tan | black, 9.4 to 1 |
| 31 | `#ba9c81` | `oklch(71.33% 0.0516 65.04)` | Au Lait Ole | black, 8.1 to 1 |
| 32 | `#a8927c` | `oklch(67.27% 0.0406 66.31)` | Clippership Twill | black, 7 to 1 |
| 33 | `#968776` | `oklch(63.22% 0.0303 68.77)` | Bedbox | black, 6 to 1 |
| 34 | `#867d71` | `oklch(59.34% 0.0213 72.43)` | Smoky Trout | black, 5.1 to 1 |
| 35 | `#78736b` | `oklch(55.77% 0.0140 77.31)` | Gauntlet Grey | white, 4.7 to 1 |
| 36 | `#6d6a65` | `oklch(52.66% 0.0091 83.40)` | Mined Coal | white, 5.3 to 1 |
| 37 | `#64635f` | `oklch(49.94% 0.0067 91.34)` | Tornado Wind | white, 6 to 1 |
| 38 | `#5c5c58` | `oklch(47.22% 0.0060 102.33)` | Zinc Dust | white, 6.7 to 1 |
| 39 | `#535450` | `oklch(44.49% 0.0068 115.84)` | Fuscous Grey | white, 7.5 to 1 |
| 40 | `#4b4e49` | `oklch(41.80% 0.0088 131.25)` | Model T | white, 8.5 to 1 |
| 41 | `#414742` | `oklch(39.16% 0.0116 147.96)` | Black Forest Green | white, 9.4 to 1 |
| 42 | `#38413d` | `oklch(36.63% 0.0151 165.35)` | Dead Sea Mud | white, 10.5 to 1 |
| 43 | `#2e3c39` | `oklch(34.22% 0.0190 182.82)` | Rookwood Shutter Green | white, 11.5 to 1 |
| 44 | `#253637` | `oklch(31.97% 0.0229 199.76)` | Cruel Sea | white, 12.5 to 1 |
| 45 | `#1e3136` | `oklch(29.91% 0.0267 215.55)` | Ore Bluish Black | white, 13.5 to 1 |
| 46 | `#192c35` | `oklch(28.07% 0.0301 229.59)` | Oceanic Noir | white, 14.4 to 1 |
| 47 | `#162734` | `oklch(26.49% 0.0328 241.27)` | Abyssal Anchorfish Blue | white, 15.2 to 1 |
| 48 | `#152332` | `oklch(25.20% 0.0344 249.97)` | Fog of War | white, 15.8 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #1c3040 0.0%, #203343 2.1%, #263646 4.3%, #2c3a49 6.4%, #343f4c 8.5%, #3b454f 10.6%, #434a53 12.8%, #4b5158 14.9%, #53575d 17.0%, #5b5e62 19.1%, #636569 21.3%, #696d70 23.4%, #6f7479 25.5%, #757e83 27.7%, #79898f 29.8%, #7c979a 31.9%, #80a5a3 34.0%, #87b3a7 36.2%, #92c0a5 38.3%, #a4cb9f 40.4%, #bad297 42.6%, #d1d690 44.7%, #e5d78b 46.8%, #f3d589 48.9%, #f9d18a 51.1%, #f9cc8a 53.2%, #f3c48b 55.3%, #e9bb8a 57.4%, #dbb188 59.6%, #cba785 61.7%, #ba9c81 63.8%, #a8927c 66.0%, #968776 68.1%, #867d71 70.2%, #78736b 72.3%, #6d6a65 74.5%, #64635f 76.6%, #5c5c58 78.7%, #535450 80.9%, #4b4e49 83.0%, #414742 85.1%, #38413d 87.2%, #2e3c39 89.4%, #253637 91.5%, #1e3136 93.6%, #192c35 95.7%, #162734 97.9%, #152332 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(29.92% 0.0400 244.69) 0.0%, oklch(31.14% 0.0380 245.22) 2.1%, oklch(32.64% 0.0349 246.61) 4.3%, oklch(34.38% 0.0311 248.56) 6.4%, oklch(36.33% 0.0268 250.79) 8.5%, oklch(38.46% 0.0222 252.99) 10.6%, oklch(40.74% 0.0178 254.87) 12.8%, oklch(43.14% 0.0137 256.13) 14.9%, oklch(45.62% 0.0103 256.49) 17.0%, oklch(48.15% 0.0078 255.64) 19.1%, oklch(50.70% 0.0066 253.29) 21.3%, oklch(53.24% 0.0069 249.15) 23.4%, oklch(55.76% 0.0090 242.88) 25.5%, oklch(58.65% 0.0138 233.68) 27.7%, oklch(61.99% 0.0209 221.75) 29.8%, oklch(65.61% 0.0299 207.68) 31.9%, oklch(69.39% 0.0402 192.07) 34.0%, oklch(73.18% 0.0512 175.49) 36.2%, oklch(76.84% 0.0624 158.54) 38.3%, oklch(80.22% 0.0731 141.82) 40.4%, oklch(83.18% 0.0828 125.90) 42.6%, oklch(85.58% 0.0909 111.39) 44.7%, oklch(87.28% 0.0969 98.87) 46.8%, oklch(88.13% 0.1002 88.93) 48.9%, oklch(87.99% 0.1002 81.86) 51.1%, oklch(86.86% 0.0969 76.20) 53.2%, oklch(84.88% 0.0910 71.66) 55.3%, oklch(82.19% 0.0830 68.27) 57.4%, oklch(78.94% 0.0733 66.03) 59.6%, oklch(75.27% 0.0627 64.95) 61.7%, oklch(71.33% 0.0516 65.04) 63.8%, oklch(67.27% 0.0406 66.31) 66.0%, oklch(63.22% 0.0303 68.77) 68.1%, oklch(59.34% 0.0213 72.43) 70.2%, oklch(55.77% 0.0140 77.31) 72.3%, oklch(52.66% 0.0091 83.40) 74.5%, oklch(49.94% 0.0067 91.34) 76.6%, oklch(47.22% 0.0060 102.33) 78.7%, oklch(44.49% 0.0068 115.84) 80.9%, oklch(41.80% 0.0088 131.25) 83.0%, oklch(39.16% 0.0116 147.96) 85.1%, oklch(36.63% 0.0151 165.35) 87.2%, oklch(34.22% 0.0190 182.82) 89.4%, oklch(31.97% 0.0229 199.76) 91.5%, oklch(29.91% 0.0267 215.55) 93.6%, oklch(28.07% 0.0301 229.59) 95.7%, oklch(26.49% 0.0328 241.27) 97.9%, oklch(25.20% 0.0344 249.97) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.299 | 0.04 | 244.7 |
| 2 | 0.551 | 0.008 | 244.7 |
| 3 | 0.882 | 0.101 | 85.1 |
| 4 | 0.52 | 0.008 | 85.1 |
| 5 | 0.252 | 0.034 | 250 |

## In these collections

- [Dusk gradients](https://grabient.com/dusk-gradients)
- [Wallpaper gradients](https://grabient.com/wallpaper-gradients)

## Other forms

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