Card

Installation

bash

npx gbs-add-block@latest -a Card

The Card component is a reusable container element that helps group related UI content. It is customizable and supports adding styles through props, making it ideal for displaying content blocks, widgets, or sections in your application.

Props Table

Prop	Type	Default	Description
`children`	`ReactNode`	—	The content to be rendered inside the Card.
`cardClass`	`string`	`"shadow-md rounded-xl p-4"`	Tailwind or custom CSS classes to style the card container.

Example

Premium Features

Discover our latest collection of modern design components crafted with attention to detail and user experience in mind.

✓

Modern design system

✓

Responsive components

✓

Dark mode support

Usage Example

Here’s an example of how to use the Card component in your project:

tsx

import { Card } from "your-library";

const App = () => {
  return (
    <Card>
      <h2 className="text-lg font-semibold">Card Title</h2>
      <p>This is the card content.</p>
    </Card>
  );
};

export default App;