Skip to content

mkamsani/css-only-fluid-font-weight

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 

Repository files navigation

CSS-Only Fluid Font Weight

Using CSS to adjust font-weight based on screen width.

Demo

https://html-preview.github.io/?url=https://github.com/mkamsani/css-only-fluid-font-weight/blob/main/index.html

Usage

You will need to rework the measurements so that a smaller viewport width would be assigned a slightly larger font-weight. See this side-by-side comparison of Geist in medium weight at a smaller screen size.

This implies using a variable font:

Legibility after adjustments will vary based on the font used.

References