Cards

Card

crd <size> <shape> <color> <shadow> <hover color> <hover shadow>

size

shape

color

shadow

h-color

h-shadow

Preview

Hi! I'm a card.

Hi! I'm a card.

Hi! I'm a card.

HTML

<div class="crd sm white rounded shadow">{children}</div>

JSX

<div className="crd lg h-orange black square">{children}</div>

Outline Card

otln-crd <size> <shape> <border size> <color> <shadow> <hover color> <hover shadow>

size

shape

border

color

shadow

h-color

h-shadow

Preview

Hi! I'm a card.

Hi! I'm a card.

HTML

<div class="otln-crd sm shadow square">{children}</div>

JSX

<div className="otln-crd md green h-pink rounded b-three">{children}</div>