Borders

Border Radius

brad is the shorthand we chose for border-radius and originally our design system just used a couple of values -2 for 2px and -4 for -4px buttttt looking in the Tachyons search it looks like this has expanded to include a rogue 11 and some sizes like md/lg etc.

tr tl modifiers for top-right top-left respectively too

Borders

• b main shorthand for border with some modifiers:
• c color (e.g. bc-gray)
• w width (e.g. bw-thick )

directions can also be modifiers:

• bb border bottom
• br border right
• bt border top
• bl border left
• bh border horizontal

so can hover states:

• -hover applies the border rule on hover (so bt-hover applies the same rules as bt but only on hover)