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

# Card Form

`CardForm` is a form component that has a header, a list of inputs and a footer that looks like a card from Vercel dashboard page.

<img src="https://mintcdn.com/ravitechsolutions/jCk1IPeJr8ul3nyO/images/components/card-form.png?fit=max&auto=format&n=jCk1IPeJr8ul3nyO&q=85&s=3c9af378478cee8bc8ed3e5a07766f2e" alt="Card Form Component" width="775" height="257" data-path="images/components/card-form.png" />

## Usage

```ts theme={null}
import { CardForm } from '@turbostack/ui'
```

```tsx theme={null}
<CardForm
  title="Your Name"
  description="This will be your display name on TurboStack.io"
  helpText="Max 64 characters."
  inputAttrs={{ // all attributes from input file
    name: 'name',
    placeholder: 'Steve Wozniak'
  }}
  handleSubmit={async (e) => {}}
/>
```