Edit page
Card
A super versatile Card component which is based on a Flex Item. Pass it any valid prop from Flex Item, in addition to a couple Card-specific props.
Props
children
Reactnode
required
Must pass it a child.
className
String | undefined
Pass it any class to extend styling.
boxShadow
String | undefined
Pass it a valid box-shadow, otherwise default will be used. Default: `0 5px 35px rgba(64, 67, 109, 0.25)`
borderRadius
String | undefined
Pass it a valid border-radius, otherwise default will be used. Default: `10px`
Usage
Default box-shadow
Custom box-shadow
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce venenatis ut sem sit amet ullamcorper. Donec sollicitudin aliquam nisi id convallis. Proin quis felis lorem. Sed ac congue nisl, ut eleifend dui. Proin tempus pharetra imperdiet. Proin id justo nec lectus facilisis maximus quis eget mauris. Nunc et nibh orci.
Custom border-radius
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce venenatis ut sem sit amet ullamcorper. Donec sollicitudin aliquam nisi id convallis. Proin quis felis lorem. Sed ac congue nisl, ut eleifend dui. Proin tempus pharetra imperdiet. Proin id justo nec lectus facilisis maximus quis eget mauris. Nunc et nibh orci.
Flexible interior content
Subtitle
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce venenatis ut sem sit amet ullamcorper. Donec sollicitudin aliquam nisi id convallis. Proin quis felis lorem. Sed ac congue nisl, ut eleifend dui. Proin tempus pharetra imperdiet. Proin id justo nec lectus facilisis maximus quis eget mauris. Nunc et nibh orci.
GitHub