> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mobile-starter.amisi.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Card

> Group related content in a reusable surface container

# Card

Use `Card` as a reusable surface wrapper for grouped content.

## Basic usage

```tsx theme={null}
import { Card, Text } from '@amisi/ui';

<Card>
  <Text variant="title">Account</Text>
</Card>;
```

## Example

```tsx theme={null}
import { Button, Card, Text, View } from '@amisi/ui';

<Card className="gap-4">
  <Text variant="title">Pro plan</Text>
  <Text variant="body">Access analytics and premium insights.</Text>
  <View className="pt-2">
    <Button onPress={handleUpgrade}>Upgrade</Button>
  </View>
</Card>;
```

## Available props

* `children: ReactNode`
* `className?: string`
* Inherits `ViewProps`

## Available methods and handlers

* Supports inherited view handlers (for example `onLayout`) through `ViewProps`