Card

Example content with some base rounded corners
Example content with some no rounded corners
Example content with some xl rounded corners
Example content with small padding
Example content with extra large padding
Markup
<Card>
...
</Card>
Custom CSS Properties
--card-background-color
--card-color
--card-shadow
--card-padding-base
--card-padding-xs
--card-padding-sm
--card-padding-lg
--card-padding-xl
Props
Title Value
class string
borderRadius "none" | "xs" | "sm" | "lg" | "xl"
padding "none" | "xs" | "sm" | "lg" | "xl"
16 px
Base size on small viewports
1.125
Ratio between steps for small viewports
22 px
Base size on larger viewports
1.333
Ratio between steps for larger viewports