Cards

Highlight main points or links with customizable icons

Card Title

This is how you use a card with an icon and a link. Clicking on this card brings you to the Card Group page.

Horizontal Card

Add a horizontal property to a card to make it horizontally displayed.

Horizontal Card

Here is an example of a horizontal card

Props

title

string

required

The title of the card

icon

string or svg

A Font Awesome icon or SVG code in icon={}

iconType

string

One of regular, solid, light, thin, sharp-solid, duotone, brands

color

string

The color of the icon as a hex code

href

string

The url that clicking on the card would navigate the user to

horizontal

boolean

Makes the card more compact and horizontal