demo · v140
@font-face font-variation-settings
Drag the sliders. The preview loads Recursive (a real variable font) via an @font-face rule whose font-variation-settings descriptor is rewritten live. With v140 the descriptor in the @font-face is the default — no need to repeat font-variation-settings on every usage.
400
0
0
The quick brown fox
@font-face rule (live):
@font-face {
font-family: "Recursive";
src: url("recursive-vf.woff2") format("woff2-variations");
font-variation-settings: "wght" 600, "MONO" 0.5;
}