# Near-black, champagne and cobalt blue oktoberfest palette

The Near-black, champagne and cobalt blue oktoberfest palette brings together dark gray, orange, gold, pale yellow, off-white, and blue. The colors span a very broad lightness range, combining moderate color with high contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark gray, and its lightest tone is pale yellow.

- Also called: Brown, orange, light blue and blue angular gradient
- Seed: `kaNQ0xvKY-GEyQ14k0E9wRN9ajw82qMEg`
- Page: https://grabient.com/kaNQ0xvKY-GEyQ14k0E9wRN9ajw82qMEg?style=angularGradient&steps=32&angle=225
- Drawn as: angular gradient, 32 steps, 225 degrees
- Kinds: light center, vivid
- Hues: complementary
- Contrast of its darkest and lightest colors: 16.4 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 | `#1d170f` | `oklch(20.87% 0.0179 69.61)` | Nightshade Berries | white, 17.7 to 1 |
| 2 | `#2a1d10` | `oklch(24.33% 0.0301 66.87)` | Brunneophobia | white, 16.3 to 1 |
| 3 | `#3d2611` | `oklch(29.19% 0.0477 62.59)` | Woodsy Brown | white, 14.1 to 1 |
| 4 | `#543012` | `oklch(34.90% 0.0677 58.08)` | Dark Catacombs | white, 11.5 to 1 |
| 5 | `#6e3b14` | `oklch(40.93% 0.0870 54.65)` | Philippine Bronze | white, 9.1 to 1 |
| 6 | `#854818` | `oklch(46.73% 0.1027 53.61)` | Brown Eyed Girl | white, 7.1 to 1 |
| 7 | `#9a561b` | `oklch(52.27% 0.1144 56.04)` | Fresh Cinnamon | white, 5.6 to 1 |
| 8 | `#af6719` | `oklch(58.11% 0.1252 61.33)` | Pumpkin Spice | black, 4.7 to 1 |
| 9 | `#c07a17` | `oklch(63.98% 0.1339 68.14)` | Caramel Coating | black, 6 to 1 |
| 10 | `#cf8f1e` | `oklch(69.64% 0.1390 75.11)` | End of Summer | black, 7.5 to 1 |
| 11 | `#daa331` | `oklch(74.81% 0.1391 80.87)` | Yellow Jasper | black, 9.2 to 1 |
| 12 | `#e4b44c` | `oklch(79.41% 0.1323 83.75)` | Va Va Voom | black, 10.9 to 1 |
| 13 | `#efc36b` | `oklch(83.80% 0.1175 83.23)` | Hawker’s Gold | black, 12.6 to 1 |
| 14 | `#f7d18b` | `oklch(87.82% 0.0980 81.88)` | Light Ginger Yellow | black, 14.4 to 1 |
| 15 | `#fcdea7` | `oklch(91.26% 0.0775 82.45)` | Bachimitsu Gold | black, 16.1 to 1 |
| 16 | `#fce9be` | `oklch(93.91% 0.0594 87.66)` | Frozen Custard | black, 17.5 to 1 |
| 17 | `#f7f2cf` | `oklch(95.65% 0.0461 100.42)` | Flashpoint | black, 18.5 to 1 |
| 18 | `#f0f8e0` | `oklch(96.71% 0.0333 121.90)` | Lemon Sugar | black, 19.2 to 1 |
| 19 | `#ecfaed` | `oklch(97.05% 0.0218 148.35)` | Spring White | black, 19.4 to 1 |
| 20 | `#ebf7f3` | `oklch(96.58% 0.0133 175.57)` | Melting Glacier | black, 19.1 to 1 |
| 21 | `#e8f1f1` | `oklch(95.19% 0.0098 199.35)` | Ethereal White | black, 18.3 to 1 |
| 22 | `#dee9ed` | `oklch(92.74% 0.0131 215.79)` | Moby Dick | black, 17 to 1 |
| 23 | `#c9dee8` | `oklch(88.82% 0.0261 226.30)` | Wind of Change | black, 15.1 to 1 |
| 24 | `#add0e3` | `oklch(83.78% 0.0456 233.06)` | Flemish Blue | black, 12.8 to 1 |
| 25 | `#8fbfde` | `oklch(78.15% 0.0672 237.46)` | Toile Blue | black, 10.6 to 1 |
| 26 | `#73add8` | `oklch(72.48% 0.0866 240.88)` | High Seas | black, 8.7 to 1 |
| 27 | `#5e9ccf` | `oklch(67.28% 0.0994 244.65)` | Tall Waves | black, 7.1 to 1 |
| 28 | `#4e8bc3` | `oklch(61.90% 0.1062 248.07)` | Blueberry Popover | black, 5.7 to 1 |
| 29 | `#3f79b3` | `oklch(56.23% 0.1095 250.51)` | Viennese Blue | white, 4.5 to 1 |
| 30 | `#3168a3` | `oklch(50.82% 0.1106 252.24)` | Distant Blue | white, 5.7 to 1 |
| 31 | `#255a95` | `oklch(46.20% 0.1109 253.50)` | Blue Regent | white, 7 to 1 |
| 32 | `#1d508b` | `oklch(42.91% 0.1116 254.54)` | Clear Night Sky | white, 8.1 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #1d170f 0.0%, #2a1d10 3.2%, #3d2611 6.5%, #543012 9.7%, #6e3b14 12.9%, #854818 16.1%, #9a561b 19.4%, #af6719 22.6%, #c07a17 25.8%, #cf8f1e 29.0%, #daa331 32.3%, #e4b44c 35.5%, #efc36b 38.7%, #f7d18b 41.9%, #fcdea7 45.2%, #fce9be 48.4%, #f7f2cf 51.6%, #f0f8e0 54.8%, #ecfaed 58.1%, #ebf7f3 61.3%, #e8f1f1 64.5%, #dee9ed 67.7%, #c9dee8 71.0%, #add0e3 74.2%, #8fbfde 77.4%, #73add8 80.6%, #5e9ccf 83.9%, #4e8bc3 87.1%, #3f79b3 90.3%, #3168a3 93.5%, #255a95 96.8%, #1d508b 100.0%);
background: conic-gradient(from 225deg in oklch, oklch(20.87% 0.0179 69.61) 0.0%, oklch(24.33% 0.0301 66.87) 3.2%, oklch(29.19% 0.0477 62.59) 6.5%, oklch(34.90% 0.0677 58.08) 9.7%, oklch(40.93% 0.0870 54.65) 12.9%, oklch(46.73% 0.1027 53.61) 16.1%, oklch(52.27% 0.1144 56.04) 19.4%, oklch(58.11% 0.1252 61.33) 22.6%, oklch(63.98% 0.1339 68.14) 25.8%, oklch(69.64% 0.1390 75.11) 29.0%, oklch(74.81% 0.1391 80.87) 32.3%, oklch(79.41% 0.1323 83.75) 35.5%, oklch(83.80% 0.1175 83.23) 38.7%, oklch(87.82% 0.0980 81.88) 41.9%, oklch(91.26% 0.0775 82.45) 45.2%, oklch(93.91% 0.0594 87.66) 48.4%, oklch(95.65% 0.0461 100.42) 51.6%, oklch(96.71% 0.0333 121.90) 54.8%, oklch(97.05% 0.0218 148.35) 58.1%, oklch(96.58% 0.0133 175.57) 61.3%, oklch(95.19% 0.0098 199.35) 64.5%, oklch(92.74% 0.0131 215.79) 67.7%, oklch(88.82% 0.0261 226.30) 71.0%, oklch(83.78% 0.0456 233.06) 74.2%, oklch(78.15% 0.0672 237.46) 77.4%, oklch(72.48% 0.0866 240.88) 80.6%, oklch(67.28% 0.0994 244.65) 83.9%, oklch(61.90% 0.1062 248.07) 87.1%, oklch(56.23% 0.1095 250.51) 90.3%, oklch(50.82% 0.1106 252.24) 93.5%, oklch(46.20% 0.1109 253.50) 96.8%, oklch(42.91% 0.1116 254.54) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.209 | 0.018 | 69.6 |
| 2 | 0.476 | 0.105 | 53.8 |
| 3 | 0.764 | 0.138 | 82.3 |
| 4 | 0.949 | 0.052 | 92.9 |
| 5 | 0.937 | 0.011 | 211.2 |
| 6 | 0.681 | 0.098 | 244 |
| 7 | 0.429 | 0.112 | 254.5 |

## In these collections

- [Oktoberfest](https://grabient.com/oktoberfest)

## Other forms

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