border-radius
Applying the border-radius
system modifier to your component will allow consumers of your component to pass in the following props:
Property | Type | Description |
---|---|---|
$borderRadius | radius | Applies a border radius to all corners of the element |
$borderTopRadius | radius | Applies a border radius to both top corners of the element |
$borderLeftRadius | radius | Applies a border radius to both left corners of the element |
$borderRightRadius | radius | Applies a border radius to both right corners of the element |
$borderBottomRadius | radius | Applies a border radius to both bottom corners of the element |
$borderTopLeftRadius | radius | Applies a border radius to the top left corner of the element |
$borderTopRightRadius | radius | Applies a border radius to the top right corner of the element |
$borderBottomLeftRadius | radius | Applies a border radius to the bottom left corner of the element |
$borderBottomRightRadius | radius | Applies a border radius to the bottom right corner of the element |