Borders And Border Radius

Borders

You can use the class .b to asing borders to an element

<div class="b ">
   div with .b class
</div>

Border Color

You can also change border-color to a theme color by using the class .b-{theme-color}

<div class="b b-blue-600 ">
   div with .b and .b-blue-600  class
</div>

Border direction

you can change the borders direction by using the classes bt (border-top) ,bb (border-boittom) ,br (border-right), bl (border-lef) and by and bx

<div class="bt  ..."></div>
<div class="br ..."></div>
<div class="bb ..."></div>
<div class="bl ..."></div>
<div class="by ..."></div>
<div class="bx ..."></div>

Border Radius

The border radius can also be change by using the classes .r or r-{number from 2 - 12} to change it intensity, the class .r-full will made an element border-radius:50%;;

<div class="r"></div>
<div class="r-2"></div>
<div class="r-3"></div>
<div class="r-4"></div>
<div class="r-full"></div>

Border Radius Positions

You can change the border radius of and expecific conner by using r{t for top, b for bottom }-{ l for left , r for right}-{ number from 2 - 12} class

<div class="rt-l"></div>
<div class="rt"></div>
<div class="rb"></div>
<div class="rb-r"></div>
<div class="r rb-r-4"></div>