Font Weight

Utilities to change an element's font-weight.

Usage

Use d-fw-{n} to change an element's font-weight.

<p class="d-fw-normal">...</p>
<p class="d-fw-medium">...</p>
<p class="d-fw-semibold">...</p>
<p class="d-fw-bold">...</p>

Variables

Variable
Output
var(--dt-font-weight-normal) 400
var(--dt-font-weight-medium) 500
var(--dt-font-weight-semi-bold) 600
var(--dt-font-weight-bold) 700

Classes

Class
Output
.d-fw-normal font-weight: var(--dt-font-weight-normal) !important;
.d-fw-medium font-weight: var(--dt-font-weight-medium) !important;
.d-fw-semibold font-weight: var(--dt-font-weight-semi-bold) !important;
.d-fw-bold font-weight: var(--dt-font-weight-bold) !important;
Font Weight documentation last updated Thursday, June 11, 2026