# Cobalt blue sun bleached pool tiles The Cobalt blue sun bleached pool tiles brings together blue, purple, red, and orange. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is purple, and its lightest tone is orange. - Also called: Tritone blue, purple and brown linear gradient - Seed: `kYelG2tSXB7QWRK7lUjx5zD1IcQi` - Page: https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi?steps=32 - Drawn as: linear gradient, 32 steps, 90 degrees - Kinds: muted - Hues: complementary - Contrast of its darkest and lightest colors: 2.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 | `#305e9b` | `oklch(48.03% 0.1116 256.64)` | Neptune Blue | white, 6.5 to 1 | | 2 | `#315b99` | `oklch(47.31% 0.1111 258.15)` | Neptune Blue | white, 6.7 to 1 | | 3 | `#325796` | `oklch(46.27% 0.1108 260.02)` | B’dazzled Blue | white, 7.1 to 1 | | 4 | `#335392` | `oklch(45.06% 0.1102 262.33)` | Chinese Blue | white, 7.5 to 1 | | 5 | `#344e8e` | `oklch(43.82% 0.1092 265.15)` | Nightly Activities | white, 7.9 to 1 | | 6 | `#374a89` | `oklch(42.70% 0.1072 268.56)` | Truth | white, 8.3 to 1 | | 7 | `#3a4785` | `oklch(41.86% 0.1041 272.64)` | Blue Estate | white, 8.7 to 1 | | 8 | `#3f4480` | `oklch(41.31% 0.0992 277.33)` | Queen of the Night Shift | white, 8.9 to 1 | | 9 | `#43427a` | `oklch(40.90% 0.0923 282.43)` | Little Blue Heron | white, 9.1 to 1 | | 10 | `#484174` | `oklch(40.63% 0.0842 288.10)` | Deep Wisteria | white, 9.2 to 1 | | 11 | `#4c406e` | `oklch(40.51% 0.0758 294.48)` | Izmir Purple | white, 9.2 to 1 | | 12 | `#504068` | `oklch(40.56% 0.0683 301.75)` | Geode | white, 9.2 to 1 | | 13 | `#544063` | `oklch(40.80% 0.0623 310.05)` | When Blue Met Red | white, 9.1 to 1 | | 14 | `#59405f` | `oklch(41.24% 0.0587 319.83)` | Navy Cosmos | white, 8.9 to 1 | | 15 | `#5f415b` | `oklch(41.91% 0.0565 331.86)` | Hortensia | white, 8.7 to 1 | | 16 | `#654356` | `oklch(42.77% 0.0555 345.28)` | Delicious Berry | white, 8.4 to 1 | | 17 | `#6b4551` | `oklch(43.78% 0.0553 359.11)` | Mixed Berry Jam | white, 8 to 1 | | 18 | `#71484c` | `oklch(44.91% 0.0559 12.35)` | Formal Maroon | white, 7.6 to 1 | | 19 | `#754c49` | `oklch(46.11% 0.0570 23.99)` | False Morel | white, 7.2 to 1 | | 20 | `#795046` | `oklch(47.36% 0.0586 33.15)` | Ancho Pepper | white, 6.9 to 1 | | 21 | `#7e5445` | `oklch(48.77% 0.0614 40.39)` | Wild Stallion | white, 6.4 to 1 | | 22 | `#835844` | `oklch(50.30% 0.0652 46.25)` | Bricktone | white, 6 to 1 | | 23 | `#895d43` | `oklch(51.91% 0.0694 51.11)` | Cocoa | white, 5.6 to 1 | | 24 | `#8e6243` | `oklch(53.54% 0.0735 55.34)` | Brilliant Oak | white, 5.2 to 1 | | 25 | `#936743` | `oklch(55.11% 0.0768 59.31)` | Antiquarian Brown | white, 4.9 to 1 | | 26 | `#976c43` | `oklch(56.59% 0.0788 63.38)` | Lion’s Mane Blonde | white, 4.6 to 1 | | 27 | `#9a7145` | `oklch(58.10% 0.0796 67.38)` | Olympic Bronze | black, 4.8 to 1 | | 28 | `#9d7748` | `oklch(59.66% 0.0796 71.09)` | Treasured | black, 5.1 to 1 | | 29 | `#a07d4c` | `oklch(61.17% 0.0791 74.42)` | Pyramid | black, 5.5 to 1 | | 30 | `#a28250` | `oklch(62.55% 0.0783 77.33)` | Dijon | black, 5.8 to 1 | | 31 | `#a48653` | `oklch(63.72% 0.0775 79.73)` | Leather Tan | black, 6.1 to 1 | | 32 | `#a68956` | `oklch(64.57% 0.0772 81.57)` | Fall Harvest | black, 6.3 to 1 | ## CSS ```css background: linear-gradient(90deg, #305e9b 0.0%, #315b99 3.2%, #325796 6.5%, #335392 9.7%, #344e8e 12.9%, #374a89 16.1%, #3a4785 19.4%, #3f4480 22.6%, #43427a 25.8%, #484174 29.0%, #4c406e 32.3%, #504068 35.5%, #544063 38.7%, #59405f 41.9%, #5f415b 45.2%, #654356 48.4%, #6b4551 51.6%, #71484c 54.8%, #754c49 58.1%, #795046 61.3%, #7e5445 64.5%, #835844 67.7%, #895d43 71.0%, #8e6243 74.2%, #936743 77.4%, #976c43 80.6%, #9a7145 83.9%, #9d7748 87.1%, #a07d4c 90.3%, #a28250 93.5%, #a48653 96.8%, #a68956 100.0%); background: linear-gradient(90deg in oklch, oklch(48.03% 0.1116 256.64) 0.0%, oklch(47.31% 0.1111 258.15) 3.2%, oklch(46.27% 0.1108 260.02) 6.5%, oklch(45.06% 0.1102 262.33) 9.7%, oklch(43.82% 0.1092 265.15) 12.9%, oklch(42.70% 0.1072 268.56) 16.1%, oklch(41.86% 0.1041 272.64) 19.4%, oklch(41.31% 0.0992 277.33) 22.6%, oklch(40.90% 0.0923 282.43) 25.8%, oklch(40.63% 0.0842 288.10) 29.0%, oklch(40.51% 0.0758 294.48) 32.3%, oklch(40.56% 0.0683 301.75) 35.5%, oklch(40.80% 0.0623 310.05) 38.7%, oklch(41.24% 0.0587 319.83) 41.9%, oklch(41.91% 0.0565 331.86) 45.2%, oklch(42.77% 0.0555 345.28) 48.4%, oklch(43.78% 0.0553 359.11) 51.6%, oklch(44.91% 0.0559 12.35) 54.8%, oklch(46.11% 0.0570 23.99) 58.1%, oklch(47.36% 0.0586 33.15) 61.3%, oklch(48.77% 0.0614 40.39) 64.5%, oklch(50.30% 0.0652 46.25) 67.7%, oklch(51.91% 0.0694 51.11) 71.0%, oklch(53.54% 0.0735 55.34) 74.2%, oklch(55.11% 0.0768 59.31) 77.4%, oklch(56.59% 0.0788 63.38) 80.6%, oklch(58.10% 0.0796 67.38) 83.9%, oklch(59.66% 0.0796 71.09) 87.1%, oklch(61.17% 0.0791 74.42) 90.3%, oklch(62.55% 0.0783 77.33) 93.5%, oklch(63.72% 0.0775 79.73) 96.8%, oklch(64.57% 0.0772 81.57) 100.0%); ``` ## Keyframes 6 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.48 | 0.112 | 256.6 | | 2 | 0.417 | 0.103 | 273.5 | | 3 | 0.409 | 0.061 | 313.7 | | 4 | 0.469 | 0.058 | 389.8 | | 5 | 0.563 | 0.079 | 422.6 | | 6 | 0.646 | 0.077 | 441.6 | ## In these collections - [Sun bleached pool tiles](https://grabient.com/sun-bleached-pool-tiles) ## Other forms - [JSON](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.json?steps=32) - [PNG](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.png?steps=32) - [SVG](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.svg?steps=32) - [CSS](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.css?steps=32) - [ASE](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.ase?steps=32) - [GPL](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.gpl?steps=32) - [GRD](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.grd?steps=32) - [Design tokens](https://grabient.com/kYelG2tSXB7QWRK7lUjx5zD1IcQi.tokens.json?steps=32) - [Social card](https://grabient.com/api/og?seed=kYelG2tSXB7QWRK7lUjx5zD1IcQi&steps=32) - [Palettes like this one](https://grabient.com/palettes?q=kYelG2tSXB7QWRK7lUjx5zD1IcQi) - [Guide for agents](https://grabient.com/llms.txt)