⬅

Borders

Border

Class Name	Description
`u-borderAll`	Adds a 1px solid border around an element.

Border Style

Alter the style of a border.

Class Name	Demo
`u-borderDotted`
`u-borderDashed`
`u-borderSolid`

Border Color

Alter the color of a border.

Brand Colors

Class Name	Demo
`u-borderPrimary`
`u-borderPrimaryLight`
`u-borderPrimaryDark`
`u-borderSecondary`
`u-borderSecondaryLight`
`u-borderSecondaryDark`

Accent Colors

Class Name	Demo
`u-borderAccentPurple`	Sample text
`u-borderBlue1`	Sample text
`u-borderBlue2`	Sample text
`u-borderBlue3`	Sample text
`u-borderBlue4`	Sample text
`u-borderBlue5`	Sample text
`u-borderBlue6`	Sample text
`u-borderBlue7`	Sample text
`u-borderBlue8`	Sample text
`u-borderBlue9`	Sample text
`u-borderBlue10`	Sample text
`u-borderBlue11`	Sample text

Grayscale

Class Name	Demo
`u-borderWhite`
`u-borderGrayLightest`
`u-borderGrayLighter`
`u-borderGrayLight`
`u-borderGray`
`u-borderGrayDark`
`u-borderGrayDarker`
`u-borderGrayDarkest`
`u-borderBlackish`

Validations

Class Name	Demo
`u-borderSuccess`
`u-borderError`

Border Position

Add a border to a particular side.

Class Name	Description
`u-borderTop`
`u-borderBottom`
`u-borderLeft`
`u-borderRight`

Border Width

Increase or decrease the width of a border.

Class Name	Demo
`u-border0`
`u-border1`
`u-border2`
`u-border3`
`u-border4`
`u-border5`

Border Radius

Add a border radius.

Class Name	Demo
`u-radius`
`u-radius100`