Decoration

Borders

We have a number of border utilities to add or remove an element (table cells, form inputs, etc.)’s borders.

Border thickness

b-0 0px – for removing borders (has the !important flag)

b-dotted – 1px default

b-dashed – 1px default

b-thin – 1px default

b-thick – 4px default

b-heavy – 8px default

Examples using -heavy:

bt-heavy

br-heavy

bb-heavy

bl-heavy

You can have borders on more than one edge by using more than one of these utilities on an element.

bx-heavy

by-heavy

Utility classes are also available for the border colors:

b-notice b-negative b-positive b-informative b-primary b-accent b-neutral b-black b-white