colrv1-07.html (843B)
1 <!DOCTYPE html> 2 <html> 3 <meta charset=utf-8> 4 <title>COLRv1 font test: radial gradient with degenerate color line</title> 5 <style> 6 @font-face { 7 font-family: CAhem; 8 src: url("CAhem.ttf"); 9 } 10 p { margin: 0; } 11 span { font: 100px/1 CAhem; } 12 .a { font-variation-settings: "GRX0" 400, "GRR0" 200, "GRX1" 600, "GRR1" 200, "COL1" 0.5, "COL2" 0.5, "COL3" 0.5; } 13 .b { font-variation-settings: "GRX0" 400, "GRR0" 200, "GRX1" 600, "GRR1" 200, "COL1" -0.5, "COL2" -0.5, "COL3" -0.5; } 14 .c { font-variation-settings: "GRX0" 400, "GRR0" 200, "GRX1" 600, "GRR1" 200, "COL1" 1.5, "COL2" 1.5, "COL3" 1.5; } 15 .d { font-variation-settings: "GRX0" 400, "GRR0" 200, "GRX1" 600, "GRR1" 200, "COL1" 2.0, "COL2" 2.0, "COL3" 2.0; } 16 </style> 17 18 <div> 19 <div><span class=a>@</div> 20 <div><span class=b>@</div> 21 <div><span class=c>@</div> 22 <div><span class=d>@</div> 23 </div>