Components
Input
Displays a styled form input field compatible with all standard HTML input types.
Install
npx shadcn@latest add https://atomx.acau.net/r/input.jsonUsage
Use Input for single-line text collection: names, emails, search queries, passwords. It's a thin wrapper over <input> that applies the design system's border, focus ring, and disabled styles. For multiline text, use Textarea instead. For accessible form fields, pair Input with Label.
Preview
Text input with label
Email input
Password input
Disabled state
Props
Extends React.ComponentProps<"input">. All standard <input> attributes are forwarded.
| Prop | Type | Notes |
|---|---|---|
type | string | Passed to <input type="">. Defaults to "text". |
disabled | boolean | Applies muted styling and removes pointer events. |
placeholder | string | Placeholder text shown when the field is empty. |