bolder

• class: fnt:wgt+1
•   fnt:wgt+1!hover
•   fnt:wgt+1!focus
• css: font-weight: bolder;

lighter

• class: fnt:wgt-1
•   fnt:wgt-1!hover
•   fnt:wgt-1!focus
• css: font-weight: lighter;

default

• class: fnt:wgt-dft
•   fnt:wgt-dft!hover
•   fnt:wgt-dft!focus
• css: font-weight: var(--dft-font-weight);

thin

• class: fnt:wgt-100
•   fnt:wgt-100!hover
•   fnt:wgt-100!focus
• css: font-weight: var(--font-wgt-thin);

xtra light

• class: fnt:wgt-200
•   fnt:wgt-200!hover
•   fnt:wgt-200!focus
• css: font-weight: var(--font-wgt-xtralight);

light

• class: fnt:wgt-300
•   fnt:wgt-300!hover
•   fnt:wgt-300!focus
• css: font-weight: var(--font-wgt-light);

normal

• class: fnt:wgt-400
•   fnt:wgt-400!hover
•   fnt:wgt-400!focus
• css: font-weight: var(--font-wgt-normal);

medium

• class: fnt:wgt-500
•   fnt:wgt-500!hover
•   fnt:wgt-500!focus
• css: font-weight: var(--font-wgt-medium);

semibold

• class: fnt:wgt-600
•   fnt:wgt-600!hover
•   fnt:wgt-600!focus
• css: font-weight: var(--font-wgt-semibold);

bold

• class: fnt:wgt-700
•   fnt:wgt-700!hover
•   fnt:wgt-700!focus
• css: font-weight: var(--font-wgt-bold);

xtrabold

• class: fnt:wgt-800
•   fnt:wgt-800!hover
•   fnt:wgt-800!focus
• css: font-weight: var(--font-wgt-xtrabold);

black

• class: fnt:wgt-900
•   fnt:wgt-900!hover
•   fnt:wgt-900!focus
• css: font-weight: var(--font-wgt-black);

Abbreviations

Supported media

Supported events

Notes

All font classes begin with “fnt” and are separated by a colon from it’s value. css values are defined in the theme-var.css file.