---
id: card
title: Card
---

import { IconsStyle } from "@site/src/components/Docs_Icons";
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
import Usage from "../component_usage/Card.mdx";
import Play from "@site/playground/Card/card.playground";

<IconsStyle />

Cards are a great way to display information, usually containing content and actions about a single subject.
Cards can contain images, buttons, text and more.
Cards are mainly used for informative purpose.

## Import

```tsx
import { Card } from "@rneui/themed";
```

## Usage

<Usage />

## Props

<div class='table-responsive'>

| Name             | Type       | Default | Description            |
| ---------------- | ---------- | ------- | ---------------------- |
| `containerStyle` | View Style |         | Outer container style. |
| `wrapperStyle`   | View Style |         | Inner container style. |

</div>

## Playground

<Play />
