Borders
Example
The basics
The first box has only the base class applied. The second has the modifier "full" which gives it a round apperance. The last one has the modifier "none" which remove border radius from all sides.
Side specific
Here we've only applied border radius to the sides.
More examples
Here we have a few more usage cases. The first box has the border base class and then removed the border on the top. The second box has a thicker border on the right and the last box has border applied on the left side and in the bottom.
Classes
Format: u-border__side--width
This utlitiy is responsive and can be used like class="u-border__side--width@md"
| Modifiers | Description | Values |
| side | Specify specific side | top. left, right, bottom |
| width | Sets the width of elements borders | 0, 1, 2 |
Border colors
Example
Colors
Border colors can be applied. Here they are:
Classes
Format: u-border__color--name
| Modifiers | Description | Values |
| name | Sets the color of elements borders | primary, secondary, success, danger, info, warning |