# Analogous teal and light blue linear swatches

Analogous teal and light blue linear swatches with 32 colors: #1a6552, #1a6a58, #1a715f, #1b7a69, #1a8473, #1a8e7f, #19998c, #19a499, #1bada6, #1fb5b1, #25bcbc, #2dc0c4, #36c3ca, #40c4d0, #49c4d4, #53c4d7, #5cc3d9, #64c1da, #6cc0db, #73c0dc, #7bc0dd, #81c1df, #89c2e1, #90c5e3, #98c7e5, #9fcae8, #a6cdea, #add0ec, #b3d2ee, #b8d5f0, #bdd7f1, #c0d9f2. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUdDl63KrCuKcw9vEEJg`
- Page: https://grabient.com/kUdDl63KrCuKcw9vEEJg?style=linearSwatches&steps=32&angle=45
- Drawn as: linear swatches, 32 steps, 45 degrees
- Kinds: dark to light, pastel, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.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 | `#1a6552` | `oklch(45.67% 0.0785 172.27)` | Embracing | white, 6.9 to 1 |
| 2 | `#1a6a58` | `oklch(47.32% 0.0811 173.56)` | Forest Rain | white, 6.4 to 1 |
| 3 | `#1a715f` | `oklch(49.56% 0.0847 175.16)` | Falcon Turquoise | white, 5.8 to 1 |
| 4 | `#1b7a69` | `oklch(52.24% 0.0892 177.03)` | Pinehurst | white, 5.1 to 1 |
| 5 | `#1a8473` | `oklch(55.24% 0.0942 179.14)` | Summer Turquoise | black, 4.5 to 1 |
| 6 | `#1a8e7f` | `oklch(58.42% 0.0994 181.44)` | Philips Green | black, 5.2 to 1 |
| 7 | `#19998c` | `oklch(61.64% 0.1044 183.91)` | Santorini Seascape | black, 5.9 to 1 |
| 8 | `#19a499` | `oklch(64.78% 0.1090 186.49)` | Baltic Turquoise | black, 6.7 to 1 |
| 9 | `#1bada6` | `oklch(67.68% 0.1129 189.16)` | Tropical Tree | black, 7.5 to 1 |
| 10 | `#1fb5b1` | `oklch(70.23% 0.1156 191.88)` | Swagger | black, 8.3 to 1 |
| 11 | `#25bcbc` | `oklch(72.28% 0.1170 194.61)` | Maximum Blue Green | black, 8.9 to 1 |
| 12 | `#2dc0c4` | `oklch(73.76% 0.1168 197.38)` | Maximum Blue Green | black, 9.4 to 1 |
| 13 | `#36c3ca` | `oklch(74.81% 0.1152 200.39)` | Turquoise Surf | black, 9.8 to 1 |
| 14 | `#40c4d0` | `oklch(75.52% 0.1125 203.58)` | Sea Serpent | black, 10 to 1 |
| 15 | `#49c4d4` | `oklch(75.96% 0.1090 206.91)` | Baharroth Blue | black, 10.1 to 1 |
| 16 | `#53c4d7` | `oklch(76.21% 0.1047 210.31)` | Naxos Sky | black, 10.2 to 1 |
| 17 | `#5cc3d9` | `oklch(76.33% 0.1000 213.74)` | Naxos Sky | black, 10.2 to 1 |
| 18 | `#64c1da` | `oklch(76.42% 0.0951 217.12)` | Naxos Sky | black, 10.2 to 1 |
| 19 | `#6cc0db` | `oklch(76.53% 0.0901 220.41)` | Magnesia Bay | black, 10.2 to 1 |
| 20 | `#73c0dc` | `oklch(76.75% 0.0854 223.55)` | Mizu | black, 10.2 to 1 |
| 21 | `#7bc0dd` | `oklch(77.15% 0.0811 226.47)` | Bright Spark | black, 10.3 to 1 |
| 22 | `#81c1df` | `oklch(77.80% 0.0774 229.14)` | Horizon Haze | black, 10.6 to 1 |
| 23 | `#89c2e1` | `oklch(78.65% 0.0736 231.72)` | Club Cruise | black, 10.8 to 1 |
| 24 | `#90c5e3` | `oklch(79.63% 0.0698 234.25)` | Deluxe Days | black, 11.2 to 1 |
| 25 | `#98c7e5` | `oklch(80.70% 0.0659 236.70)` | Pale Cerulean | black, 11.6 to 1 |
| 26 | `#9fcae8` | `oklch(81.83% 0.0620 239.04)` | Windsor Way | black, 12 to 1 |
| 27 | `#a6cdea` | `oklch(82.96% 0.0583 241.25)` | Sail | black, 12.5 to 1 |
| 28 | `#add0ec` | `oklch(84.07% 0.0547 243.30)` | Gentle Wind | black, 12.9 to 1 |
| 29 | `#b3d2ee` | `oklch(85.11% 0.0515 245.17)` | Modern Blue | black, 13.4 to 1 |
| 30 | `#b8d5f0` | `oklch(86.04% 0.0485 246.82)` | Summer Birthday | black, 13.8 to 1 |
| 31 | `#bdd7f1` | `oklch(86.82% 0.0461 248.25)` | Delicate Blue Mist | black, 14.1 to 1 |
| 32 | `#c0d9f2` | `oklch(87.40% 0.0441 249.41)` | Delicate Blue Mist | black, 14.4 to 1 |

## CSS

```css
background: linear-gradient(45deg, #1a6552 0.000% 3.125%, #1a6a58 3.125% 6.250%, #1a715f 6.250% 9.375%, #1b7a69 9.375% 12.500%, #1a8473 12.500% 15.625%, #1a8e7f 15.625% 18.750%, #19998c 18.750% 21.875%, #19a499 21.875% 25.000%, #1bada6 25.000% 28.125%, #1fb5b1 28.125% 31.250%, #25bcbc 31.250% 34.375%, #2dc0c4 34.375% 37.500%, #36c3ca 37.500% 40.625%, #40c4d0 40.625% 43.750%, #49c4d4 43.750% 46.875%, #53c4d7 46.875% 50.000%, #5cc3d9 50.000% 53.125%, #64c1da 53.125% 56.250%, #6cc0db 56.250% 59.375%, #73c0dc 59.375% 62.500%, #7bc0dd 62.500% 65.625%, #81c1df 65.625% 68.750%, #89c2e1 68.750% 71.875%, #90c5e3 71.875% 75.000%, #98c7e5 75.000% 78.125%, #9fcae8 78.125% 81.250%, #a6cdea 81.250% 84.375%, #add0ec 84.375% 87.500%, #b3d2ee 87.500% 90.625%, #b8d5f0 90.625% 93.750%, #bdd7f1 93.750% 96.875%, #c0d9f2 96.875% 100.000%);
background: linear-gradient(45deg, oklch(45.67% 0.0785 172.27) 0.000% 3.125%, oklch(47.32% 0.0811 173.56) 3.125% 6.250%, oklch(49.56% 0.0847 175.16) 6.250% 9.375%, oklch(52.24% 0.0892 177.03) 9.375% 12.500%, oklch(55.24% 0.0942 179.14) 12.500% 15.625%, oklch(58.42% 0.0994 181.44) 15.625% 18.750%, oklch(61.64% 0.1044 183.91) 18.750% 21.875%, oklch(64.78% 0.1090 186.49) 21.875% 25.000%, oklch(67.68% 0.1129 189.16) 25.000% 28.125%, oklch(70.23% 0.1156 191.88) 28.125% 31.250%, oklch(72.28% 0.1170 194.61) 31.250% 34.375%, oklch(73.76% 0.1168 197.38) 34.375% 37.500%, oklch(74.81% 0.1152 200.39) 37.500% 40.625%, oklch(75.52% 0.1125 203.58) 40.625% 43.750%, oklch(75.96% 0.1090 206.91) 43.750% 46.875%, oklch(76.21% 0.1047 210.31) 46.875% 50.000%, oklch(76.33% 0.1000 213.74) 50.000% 53.125%, oklch(76.42% 0.0951 217.12) 53.125% 56.250%, oklch(76.53% 0.0901 220.41) 56.250% 59.375%, oklch(76.75% 0.0854 223.55) 59.375% 62.500%, oklch(77.15% 0.0811 226.47) 62.500% 65.625%, oklch(77.80% 0.0774 229.14) 65.625% 68.750%, oklch(78.65% 0.0736 231.72) 68.750% 71.875%, oklch(79.63% 0.0698 234.25) 71.875% 75.000%, oklch(80.70% 0.0659 236.70) 75.000% 78.125%, oklch(81.83% 0.0620 239.04) 78.125% 81.250%, oklch(82.96% 0.0583 241.25) 81.250% 84.375%, oklch(84.07% 0.0547 243.30) 84.375% 87.500%, oklch(85.11% 0.0515 245.17) 87.500% 90.625%, oklch(86.04% 0.0485 246.82) 90.625% 93.750%, oklch(86.82% 0.0461 248.25) 93.750% 96.875%, oklch(87.40% 0.0441 249.41) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.457 | 0.079 | 172.3 |
| 2 | 0.728 | 0.117 | 195.5 |
| 3 | 0.776 | 0.079 | 228.3 |
| 4 | 0.874 | 0.044 | 249.4 |

## In these collections

- [Coastal gradients](https://grabient.com/coastal-gradients)

## Other forms

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