All components
Input
Text fields with outline, subtle, and flushed variants that inherit your palette and radius.
Variants
outline
subtle
flushed
Sizes
xs
sm
md
lg
xl
Install
zsh — input
1bunx stylexblocks add inputUsage — Ark UI
input.tsx
123456789101112131415161718import { Input } from "#components/ui/ark-ui/input.tsx";
export function Example() { return ( <> {/* variant + size props resolve through the StyleX recipe */} <Input variant="outline" size="md" placeholder="Email address" />
{/* native props pass straight through */} <Input variant="subtle" type="email" required aria-label="Email" />
{/* composition: asChild forwards everything onto your element */} <Input asChild variant="flushed"> <input inputMode="numeric" placeholder="OTP code" /> </Input> </> );}