Border

Borders help us define elements within our UI. Keeping sizes consistent help us maintain uniformity.

We use borders for components to provide a more defined edge to our product. There are three tokens available for use. The reason there are just two is to encourage a cleaner, more consistent design interface.

Foundations Borders

Border tokens

Name

Value

border-size-sm

1px

border-size-lg

2px