One File — Infinity of Styles

Regular fonts require a separate file for each style (Bold, Light, Italic). Variable Fonts allow smoothly changing parameters within a single file.

Main Axes:

Instead of fixed values, we use sliders:

1. wght (Weight): Weight from 100 to 900. Can make font-weight: 542;.
2. wdth (Width): Letter width (narrow/wide).
3. slnt (Slant): Slant.
4. ital (Italic): Switch to italic.
5. opsz (Optical Size): Adjustment for size (small text — thicker lines, large — thinner).

.dynamic-text {
  font-family: 'Inter Variable', sans-serif;
  font-weight: 500;
  font-variation-settings: 'wght' 500, 'wdth' 75; /* Fine axis tuning */
}