Press/to search

Typography

Font Weight

Utilities for sets the font weight.


Class

classcss
font-hairlinefont-weight: 100Text
font-thinfont-weight: 200Text
font-lightfont-weight: 300Text
font-normalfont-weight: 400Text
font-mediumfont-weight: 500Text
font-semiboldfont-weight: 600Text
font-boldfont-weight: 700Text
font-extraboldfont-weight: 800Text
font-blackfont-weight: 900Text

Usage

Set font-weight to an element.

<!-- Example -->
<y class="font-light">
...
</y>

Set font-weight with Google Fonts. (See Font Family).

<!-- Example -->
<y class="font-roboto font-light">
...
</y>

Variant

ResponsiveDark ModeLight ModeReduce-MotionPortraitLandscapeHoverGroup-HoverFocusGroup-FocusFocus-VisibleFocus-WithinActiveVisitedCheckedDisabled

Default enabled variants. Read more information about the Responsive and Pseudo-Class Variants.