forked from w3c/csswg-drafts
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathrectangular-fff-01e.html
More file actions
25 lines (24 loc) · 2.89 KB
/
rectangular-fff-01e.html
File metadata and controls
25 lines (24 loc) · 2.89 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html>
<title>Effect of Interpolation Colorspace on Gradient between #FF and #0iE: rectangular</title>
<!-- Gradients are simulated by piecewise construction from images-3 srgb gradients
See https://colorjs.io/apps/gradients/?color1=white&color2=%2301E
and set gamut mapping ON, output space off, steps 6 deltaE -->
<style>
div.gradient {
width: 400px;
height: 120px;
margin: 0;
}
#srgb {
background: linear-gradient(to right, rgb(100% 100% 100%), rgb(95.24% 95.56% 99.68%), rgb(90.48% 91.11% 99.37%), rgb(85.71% 86.67% 99.05%), rgb(80.95% 82.22% 98.73%), rgb(76.19% 77.78% 98.41%), rgb(71.43% 73.33% 98.1%), rgb(66.67% 68.89% 97.78%), rgb(61.9% 64.44% 97.46%), rgb(57.14% 60% 97.14%), rgb(52.38% 55.56% 96.83%), rgb(47.62% 51.11% 96.51%), rgb(42.86% 46.67% 96.19%), rgb(38.1% 42.22% 95.87%), rgb(33.33% 37.78% 95.56%), rgb(28.57% 33.33% 95.24%), rgb(23.81% 28.89% 94.92%), rgb(19.05% 24.44% 94.6%), rgb(14.29% 20% 94.29%), rgb(9.52% 15.56% 93.97%), rgb(4.76% 11.11% 93.65%), rgb(0% 6.67% 93.33%));
}
#oklab {
background: linear-gradient(to right, rgb(100% 100% 100%), rgb(94.66% 96.59% 100%), rgb(89.36% 93.16% 100%), rgb(84.09% 89.72% 100%), rgb(78.86% 86.27% 100%), rgb(73.67% 82.79% 100%), rgb(68.52% 79.28% 100%), rgb(63.41% 75.75% 100%), rgb(58.33% 72.17% 100%), rgb(53.29% 68.56% 100%), rgb(48.28% 64.9% 100%), rgb(43.3% 61.17% 99.88%), rgb(38.36% 57.36% 99.47%), rgb(33.44% 53.47% 98.99%), rgb(28.54% 49.45% 98.46%), rgb(23.64% 45.27% 97.88%), rgb(18.74% 40.9% 97.24%), rgb(13.8% 36.23% 96.55%), rgb(8.75% 31.14% 95.82%), rgb(3.46% 25.37% 95.04%), rgb(0.08% 18.25% 94.21%), rgb(0% 6.67% 93.33%));
}
#cielab {
background: linear-gradient(to right, rgb(100% 100% 100%), rgb(98.56% 97.74% 99.99%), rgb(97.11% 95.5% 99.96%), rgb(95.65% 93.25% 99.93%), rgb(94.18% 91.02% 99.89%), rgb(92.7% 88.79% 99.84%), rgb(91.2% 86.57% 99.78%), rgb(89.7% 84.36% 99.72%), rgb(88.18% 82.15% 99.64%), rgb(86.64% 79.95% 99.56%), rgb(85.1% 77.76% 99.47%), rgb(83.54% 75.58% 99.38%), rgb(81.96% 73.4% 99.27%), rgb(80.37% 71.23% 99.16%), rgb(78.76% 69.07% 99.04%), rgb(77.13% 66.91% 98.92%), rgb(75.48% 64.76% 98.79%), rgb(73.81% 62.61% 98.65%), rgb(72.12% 60.47% 98.5%), rgb(70.41% 58.34% 98.35%), rgb(68.67% 56.21% 98.19%), rgb(66.91% 54.09% 98.03%), rgb(65.11% 51.98% 97.86%), rgb(63.29% 49.86% 97.68%), rgb(61.42% 47.76% 97.5%), rgb(59.53% 45.65% 97.31%), rgb(57.58% 43.55% 97.11%), rgb(55.6% 41.45% 96.91%), rgb(53.56% 39.35% 96.71%), rgb(51.46% 37.24% 96.5%), rgb(49.3% 35.14% 96.28%), rgb(47.06% 33.03% 96.06%), rgb(44.74% 30.9% 95.84%), rgb(42.31% 28.77% 95.6%), rgb(39.77% 26.62% 95.37%), rgb(37.07% 24.45% 95.13%), rgb(34.19% 22.24% 94.89%), rgb(31.07% 19.99% 94.64%), rgb(27.62% 17.67% 94.38%), rgb(23.7% 15.25% 94.13%), rgb(19.01% 12.7% 93.87%), rgb(12.74% 9.91% 93.6%), rgb(0% 6.67% 93.33%));
}
</style>
<div class="gradient" id="cielab"></div>
<div class="gradient" id="srgb"></div>
<div class="gradient" id="oklab"></div>