Card

!npm (scoped)

#### View on MongoDB.design

Installation

$3

``shell
pnpm add @leafygreen-ui/card
`

$3

`shell
yarn add @leafygreen-ui/card
`

$3

`shell
npm install @leafygreen-ui/card
`

Example

`tsx
import Card from '@leafygreen-ui/card';


This is my card component
;
`

Properties

Card is a styled wrapper for the Box component. Any properties you would pass to Box can also be passed to Card.

| Prop | Type | Description | Default |
| ----------- | ----------------- | ----------------------------------------------------------------- | ------- |
| children | React.ReactNode | Content rendered inside of the component | |
| className | string | Adds a className to the class attribute | |
| darkMode | boolean | Determines whether or not the component will appear in dark mode. | false |

_Any other properties will be spread on the Box element._

Usage and Interactivity

This component is designed to be a container for other elements and content. We discourage onClick or href directly to the Card component. Instead, we recommend adding interactive elements inside the component.

$3

`tsx



`

$3

`tsx
This is my card component
``