---
import { Input } from "@/components/ui/input"
---
<Input class="max-w-sm" placeholder="Email" />Installation
npx shadcn@latest add @fulldev/input
Usage
import { Input } from "@/components/ui/input"
<Input />
Examples
Basic
---
import { Input } from "@/components/ui/input"
---
<Input class="max-w-sm" placeholder="Email" />Disabled
---
import { Input } from "@/components/ui/input"
---
<Input class="max-w-sm" placeholder="Email" disabled />Invalid
---
import { Input } from "@/components/ui/input"
---
<Input class="max-w-sm" placeholder="Email" aria-invalid="true" />File
---
import { Input } from "@/components/ui/input"
---
<Input class="max-w-sm" type="file" />Notes
- Use
Inputfor single-line text-like controls such as email, password, and phone fields. - Pair it with
Labelfor simple forms, or use Field when you also need descriptions, validation, or grouped layouts. - Set
aria-invalidwhen the control should display an invalid state.
API Reference
See the GitHub source code for more information on props.