Skip to content

Line Height

Default line-height rem table

PixelTypeRemCustom PropertyInfo
22pxsmall1.375rem--line-height-small
24pxbasis1.5rem--line-height-basisBody
32pxmedium2rem--line-height-medium
48pxlarge3rem--line-height-large
56pxx-large3.5rem--line-height-x-large

Additional line-height em table

PixelTypeEmCustom PropertyInfo
16pxx-small--em1em--line-height-x-small--em
24pxbasis--em1.5em--line-height-basis--em

How to use the line heights (CSS)

/* I have a default height */
.dnb-p {
line-height: var(--line-height-basis); /* 1.5rem - 24px */
}