Border Radius

There is a four step scale for border radius in addition to a utility that sets border radius to 100%, which when combined with an explicit height and width will produce a circle.

Examples

<template>
  <div v-br="0"></div>
</template>

v-br="0"

v-br="1"

v-br="2"

v-br="3"

v-br="4"

v-br.pill

Combine v-br.100 with a fixed height and width to make a circle.

<template>
  <div v-dt v-w="4">
    <div v-br.100></div>
  </div>
</template>

v-br.100

Reference

• Border Radius Source Docs | Tachyons
• border-radius | MDN