Violet petrol and sea green oil sheen

Seamless black, blue and teal color palette

Petroleum black opens through deep violet, blue, petrol teal, and muted sea green before returning to an almost black edge. Angular gradient, 96 colors at 90°: #080a10, #342560, #145079, #218674, #0a0d11. Edit and export CSS, SVG, PNG or a shader.

5 editable OKLCH keyframes.

#080a10
#080b12
#090c14
#0a0d16
#0b0e19
#0c0f1c
#0d101f
#0f1123
#101226
#12132a
#14152e
#161632
#191736
#1b183a
#1e193e
#211a42
#231b46
#261c4a
#291e4d
#2b1f51
#2d2054
#2f2158
#31225b
#33235d
#342560
#352663
#352865
#362967
#362b69
#352c6b
#352e6c
#34306e
#34316f
#323370
#313571
#303772
#2e3973
#2d3a74
#2b3c75
#293e75
#274076
#254276
#234476
#214677
#1e4877
#1c4a78
#194c78
#174e79
#145079
#10537a
#0a567b
#03597d
#005c7d
#00607d
#00637d
#00677e
#006a7e
#006e7e
#00727f
#00757f
#00797f
#007c7f
#007f7e
#00827e
#00847d
#00867c
#09887b
#128979
#188978
#1d8976
#208875
#218674
#228472
#218171
#207e6f
#1e796d
#1c746b
#1a6f69
#196966
#186262
#175c5e
#17555a
#174e55
#174750
#18404a
#173a44
#17333e
#162d38
#152732
#13222c
#121d26
#101921
#0e151c
#0d1217
#0b0f14
#0a0d11

CSS

background: conic-gradient(from 90deg in oklch, oklch(14.57% 0.0138 269.30) 0.0%, oklch(14.96% 0.0158 269.86) 1.1%, oklch(15.42% 0.0183 270.61) 2.1%, oklch(15.94% 0.0212 271.51) 3.2%, oklch(16.52% 0.0245 272.55) 4.2%, oklch(17.14% 0.0280 273.71) 5.3%, oklch(17.82% 0.0319 274.98) 6.3%, oklch(18.53% 0.0360 276.32) 7.4%, oklch(19.28% 0.0402 277.71) 8.4%, oklch(20.06% 0.0446 279.15) 9.5%, oklch(20.86% 0.0492 280.60) 10.5%, oklch(21.69% 0.0537 282.05) 11.6%, oklch(22.52% 0.0584 283.48) 12.6%, oklch(23.36% 0.0630 284.86) 13.7%, oklch(24.21% 0.0675 286.18) 14.7%, oklch(25.05% 0.0720 287.41) 15.8%, oklch(25.89% 0.0763 288.54) 16.8%, oklch(26.71% 0.0804 289.54) 17.9%, oklch(27.51% 0.0844 290.40) 18.9%, oklch(28.29% 0.0880 291.09) 20.0%, oklch(29.04% 0.0914 291.60) 21.1%, oklch(29.76% 0.0944 291.90) 22.1%, oklch(30.43% 0.0970 291.97) 23.2%, oklch(31.06% 0.0992 291.79) 24.2%, oklch(31.64% 0.1010 291.35) 25.3%, oklch(32.18% 0.1023 290.69) 26.3%, oklch(32.68% 0.1034 289.84) 27.4%, oklch(33.17% 0.1041 288.80) 28.4%, oklch(33.62% 0.1045 287.59) 29.5%, oklch(34.06% 0.1047 286.22) 30.5%, oklch(34.47% 0.1046 284.70) 31.6%, oklch(34.87% 0.1044 283.04) 32.6%, oklch(35.25% 0.1039 281.25) 33.7%, oklch(35.63% 0.1033 279.34) 34.7%, oklch(35.99% 0.1025 277.33) 35.8%, oklch(36.34% 0.1016 275.22) 36.8%, oklch(36.70% 0.1006 273.02) 37.9%, oklch(37.05% 0.0996 270.75) 38.9%, oklch(37.40% 0.0985 268.41) 40.0%, oklch(37.76% 0.0974 266.02) 41.1%, oklch(38.12% 0.0964 263.58) 42.1%, oklch(38.50% 0.0953 261.11) 43.2%, oklch(38.88% 0.0943 258.62) 44.2%, oklch(39.28% 0.0934 256.12) 45.3%, oklch(39.70% 0.0926 253.61) 46.3%, oklch(40.14% 0.0919 251.12) 47.4%, oklch(40.60% 0.0914 248.64) 48.4%, oklch(41.09% 0.0910 246.20) 49.5%, oklch(41.61% 0.0909 243.75) 50.5%, oklch(42.23% 0.0909 241.03) 51.6%, oklch(42.94% 0.0911 238.04) 52.6%, oklch(43.74% 0.0915 234.81) 53.7%, oklch(44.61% 0.0903 231.40) 54.7%, oklch(45.52% 0.0886 227.80) 55.8%, oklch(46.48% 0.0873 224.07) 56.8%, oklch(47.46% 0.0866 220.24) 57.9%, oklch(48.46% 0.0862 216.37) 58.9%, oklch(49.46% 0.0863 212.48) 60.0%, oklch(50.44% 0.0869 208.61) 61.1%, oklch(51.40% 0.0877 204.80) 62.1%, oklch(52.32% 0.0890 201.08) 63.2%, oklch(53.19% 0.0905 197.50) 64.2%, oklch(53.99% 0.0923 194.09) 65.3%, oklch(54.71% 0.0942 190.90) 66.3%, oklch(55.34% 0.0963 187.94) 67.4%, oklch(55.86% 0.0983 185.27) 68.4%, oklch(56.27% 0.0987 182.93) 69.5%, oklch(56.54% 0.0983 180.94) 70.5%, oklch(56.66% 0.0976 179.35) 71.6%, oklch(56.63% 0.0968 178.19) 72.6%, oklch(56.43% 0.0956 177.50) 73.7%, oklch(56.03% 0.0941 177.32) 74.7%, oklch(55.43% 0.0923 177.71) 75.8%, oklch(54.58% 0.0900 178.71) 76.8%, oklch(53.49% 0.0874 180.28) 77.9%, oklch(52.21% 0.0844 182.36) 78.9%, oklch(50.73% 0.0811 184.92) 80.0%, oklch(49.10% 0.0775 187.89) 81.1%, oklch(47.32% 0.0737 191.23) 82.1%, oklch(45.41% 0.0697 194.88) 83.2%, oklch(43.41% 0.0655 198.81) 84.2%, oklch(41.33% 0.0612 202.95) 85.3%, oklch(39.19% 0.0568 207.25) 86.3%, oklch(37.01% 0.0524 211.67) 87.4%, oklch(34.82% 0.0480 216.16) 88.4%, oklch(32.63% 0.0436 220.67) 89.5%, oklch(30.47% 0.0392 225.14) 90.5%, oklch(28.36% 0.0350 229.52) 91.6%, oklch(26.32% 0.0309 233.78) 92.6%, oklch(24.36% 0.0270 237.84) 93.7%, oklch(22.53% 0.0233 241.68) 94.7%, oklch(20.82% 0.0199 245.22) 95.8%, oklch(19.27% 0.0168 248.43) 96.8%, oklch(17.89% 0.0140 251.26) 97.9%, oklch(16.71% 0.0116 253.65) 98.9%, oklch(15.75% 0.0096 255.56) 100.0%);

In these collections

Oil slick colors