# Brown, red, pink and white angular swatches

Brown, red, pink and white angular swatches with 32 colors: #320d0b, #380e0d, #400f0f, #4a1111, #551314, #621517, #6e171b, #7b181e, #861921, #921924, #9f1626, #ab1127, #b80a2a, #c4052d, #d00831, #da1438, #e22540, #ea364a, #ef4755, #f45762, #f7676e, #fa767b, #fc8487, #ff9193, #ff9ea0, #ffacad, #ffbabb, #ffc7c8, #ffd3d3, #ffdede, #ffe6e7, #ffeded. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWOCwSMzM_snQP7jLz--ge_o`
- Page: https://grabient.com/kWOCwSMzM_snQP7jLz--ge_o?style=angularSwatches&steps=32&angle=0
- Drawn as: angular swatches, 32 steps, 0 degrees
- Kinds: dark to light, vivid, warm
- Hues: monochromatic
- Contrast of its darkest and lightest colors: 15.5 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 | `#320d0b` | `oklch(22.05% 0.0606 25.31)` | Black Rooster | white, 17.5 to 1 |
| 2 | `#380e0d` | `oklch(23.50% 0.0670 25.14)` | Black Rooster | white, 17 to 1 |
| 3 | `#400f0f` | `oklch(25.44% 0.0756 24.92)` | English Breakfast | white, 16.2 to 1 |
| 4 | `#4a1111` | `oklch(27.76% 0.0858 24.65)` | Minotaur Hide | white, 15.1 to 1 |
| 5 | `#551314` | `oklch(30.33% 0.0971 24.35)` | Mama Africa | white, 14 to 1 |
| 6 | `#621517` | `oklch(33.02% 0.1089 24.03)` | Blood Organ | white, 12.8 to 1 |
| 7 | `#6e171b` | `oklch(35.74% 0.1209 23.72)` | Arterial | white, 11.6 to 1 |
| 8 | `#7b181e` | `oklch(38.34% 0.1325 23.41)` | UP Maroon | white, 10.5 to 1 |
| 9 | `#861921` | `oklch(40.73% 0.1432 23.13)` | Heirloom Red | white, 9.6 to 1 |
| 10 | `#921924` | `oklch(43.01% 0.1553 22.86)` | Nigritella Red | white, 8.7 to 1 |
| 11 | `#9f1626` | `oklch(45.26% 0.1689 22.59)` | Cut Ruby | white, 8 to 1 |
| 12 | `#ab1127` | `oklch(47.49% 0.1828 22.31)` | Haute Red | white, 7.3 to 1 |
| 13 | `#b80a2a` | `oklch(49.73% 0.1960 22.04)` | Valentine Lava | white, 6.7 to 1 |
| 14 | `#c4052d` | `oklch(52.00% 0.2073 21.77)` | Pomodoro | white, 6.1 to 1 |
| 15 | `#d00831` | `oklch(54.30% 0.2158 21.49)` | Cherry | white, 5.6 to 1 |
| 16 | `#da1438` | `oklch(56.67% 0.2201 21.22)` | Wild Rider Red | white, 5 to 1 |
| 17 | `#e22540` | `oklch(59.11% 0.2195 20.95)` | Alizarin | black, 4.5 to 1 |
| 18 | `#ea364a` | `oklch(61.64% 0.2139 20.68)` | Red Radish | black, 5.1 to 1 |
| 19 | `#ef4755` | `oklch(64.25% 0.2044 20.40)` | Vineyard Autumn | black, 5.7 to 1 |
| 20 | `#f45762` | `oklch(66.89% 0.1920 20.13)` | Ripe Malinka | black, 6.3 to 1 |
| 21 | `#f7676e` | `oklch(69.55% 0.1777 19.86)` | Sugar Coral | black, 7.1 to 1 |
| 22 | `#fa767b` | `oklch(72.20% 0.1624 19.59)` | Embarrassment | black, 7.9 to 1 |
| 23 | `#fc8487` | `oklch(74.80% 0.1471 19.31)` | Strawberry Field | black, 8.7 to 1 |
| 24 | `#ff9193` | `oklch(77.33% 0.1328 19.04)` | Cherished One | black, 9.6 to 1 |
| 25 | `#ff9ea0` | `oklch(79.86% 0.1157 18.76)` | Rubber Radish | black, 10.6 to 1 |
| 26 | `#ffacad` | `oklch(82.53% 0.0977 18.45)` | Apricot Haze | black, 11.7 to 1 |
| 27 | `#ffbabb` | `oklch(85.26% 0.0803 18.14)` | Hard Candy | black, 12.9 to 1 |
| 28 | `#ffc7c8` | `oklch(87.94% 0.0641 17.82)` | Cinderella Pink | black, 14.2 to 1 |
| 29 | `#ffd3d3` | `oklch(90.46% 0.0495 17.52)` | Girlie | black, 15.5 to 1 |
| 30 | `#ffdede` | `oklch(92.72% 0.0370 17.25)` | Rose Tonic | black, 16.7 to 1 |
| 31 | `#ffe6e7` | `oklch(94.63% 0.0269 17.03)` | Vanilla Strawberry | black, 17.7 to 1 |
| 32 | `#ffeded` | `oklch(96.06% 0.0195 16.86)` | White Gloss | black, 18.6 to 1 |

## CSS

```css
background: conic-gradient(from 0deg, #320d0b 0.000% 3.125%, #380e0d 3.125% 6.250%, #400f0f 6.250% 9.375%, #4a1111 9.375% 12.500%, #551314 12.500% 15.625%, #621517 15.625% 18.750%, #6e171b 18.750% 21.875%, #7b181e 21.875% 25.000%, #861921 25.000% 28.125%, #921924 28.125% 31.250%, #9f1626 31.250% 34.375%, #ab1127 34.375% 37.500%, #b80a2a 37.500% 40.625%, #c4052d 40.625% 43.750%, #d00831 43.750% 46.875%, #da1438 46.875% 50.000%, #e22540 50.000% 53.125%, #ea364a 53.125% 56.250%, #ef4755 56.250% 59.375%, #f45762 59.375% 62.500%, #f7676e 62.500% 65.625%, #fa767b 65.625% 68.750%, #fc8487 68.750% 71.875%, #ff9193 71.875% 75.000%, #ff9ea0 75.000% 78.125%, #ffacad 78.125% 81.250%, #ffbabb 81.250% 84.375%, #ffc7c8 84.375% 87.500%, #ffd3d3 87.500% 90.625%, #ffdede 90.625% 93.750%, #ffe6e7 93.750% 96.875%, #ffeded 96.875% 100.000%);
background: conic-gradient(from 0deg, oklch(22.05% 0.0606 25.31) 0.000% 3.125%, oklch(23.50% 0.0670 25.14) 3.125% 6.250%, oklch(25.44% 0.0756 24.92) 6.250% 9.375%, oklch(27.76% 0.0858 24.65) 9.375% 12.500%, oklch(30.33% 0.0971 24.35) 12.500% 15.625%, oklch(33.02% 0.1089 24.03) 15.625% 18.750%, oklch(35.74% 0.1209 23.72) 18.750% 21.875%, oklch(38.34% 0.1325 23.41) 21.875% 25.000%, oklch(40.73% 0.1432 23.13) 25.000% 28.125%, oklch(43.01% 0.1553 22.86) 28.125% 31.250%, oklch(45.26% 0.1689 22.59) 31.250% 34.375%, oklch(47.49% 0.1828 22.31) 34.375% 37.500%, oklch(49.73% 0.1960 22.04) 37.500% 40.625%, oklch(52.00% 0.2073 21.77) 40.625% 43.750%, oklch(54.30% 0.2158 21.49) 43.750% 46.875%, oklch(56.67% 0.2201 21.22) 46.875% 50.000%, oklch(59.11% 0.2195 20.95) 50.000% 53.125%, oklch(61.64% 0.2139 20.68) 53.125% 56.250%, oklch(64.25% 0.2044 20.40) 56.250% 59.375%, oklch(66.89% 0.1920 20.13) 59.375% 62.500%, oklch(69.55% 0.1777 19.86) 62.500% 65.625%, oklch(72.20% 0.1624 19.59) 65.625% 68.750%, oklch(74.80% 0.1471 19.31) 68.750% 71.875%, oklch(77.33% 0.1328 19.04) 71.875% 75.000%, oklch(79.86% 0.1157 18.76) 75.000% 78.125%, oklch(82.53% 0.0977 18.45) 78.125% 81.250%, oklch(85.26% 0.0803 18.14) 81.250% 84.375%, oklch(87.94% 0.0641 17.82) 84.375% 87.500%, oklch(90.46% 0.0495 17.52) 87.500% 90.625%, oklch(92.72% 0.0370 17.25) 90.625% 93.750%, oklch(94.63% 0.0269 17.03) 93.750% 96.875%, oklch(96.06% 0.0195 16.86) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.22 | 0.061 | 25.3 |
| 2 | 0.402 | 0.141 | 23.2 |
| 3 | 0.579 | 0.22 | 21.1 |
| 4 | 0.78 | 0.13 | 19 |
| 5 | 0.961 | 0.021 | 16.9 |

## In these collections

- [Sequential data gradients](https://grabient.com/sequential-data-gradients)

## Other forms

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