| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Gradient interpolation</title> |
| <meta name="fuzzy" content="maxDifference=1-2;totalPixels=0-10000"> |
| <link rel="author" title="Mike Bremford" href="mailto:mike@bfo.com"> |
| <link rel="help" href="https://www.w3.org/TR/css-color-4/#interpolation"> |
| <meta name="assert" content="Test gradient interpolation in LCH uses the shorter hue-interpolation method if unspecified"> |
| <link rel="match" href="gradient-eval-007-ref.html"> |
| <style> |
| :root { |
| --start: lch(60% 60 70); |
| --end: lch(60% 60 290); |
| --t: 0.5; |
| --big: 131070000px; |
| } |
| .test { |
| width: 100px; |
| height: 100px; |
| background: linear-gradient(in lch, var(--start) calc(var(--big) * (0 - var(--t))), var(--end) calc(var(--big) * (1 - var(--t)))); |
| } |
| </style> |
| </head> |
| <body> |
| <div class="test"></div> |
| </body> |
| </html> |