Card Group
This section previews the Card Group component.
I have implemented the card group
component into markdown which is ready to use.
Preview
Heading 1
This is an example of card content with columns.
Heading 2
This is an example of card content with columns.
Grid Card
This is a horizontal card layout.
Horizontal Card
This is a horizontal card layout.
Props
Prop | Type | Default | Description |
---|---|---|---|
cols | number | {2} | By default 2 The number of columns per row |
Code
<CardGroup cols={2}>
<Card title="Heading 1" icon="Heading1">
This is an example of card content with columns.
</Card>
<Card title="Heading 2" icon="Heading2">
This is an example of card content with columns.
</Card>
<Card title="Grid Card" icon="Grid" horizontal>
This is a horizontal card layout.
</Card>
<Card title="Horizontal Card" icon="Layout" horizontal>
This is a horizontal card layout.
</Card>
</CardGroup>
Published on Feb 20, 2025