InputNew

The text field foundation with adornments, size variants, and animated focus ring.

Interaction Type

Type text. Focus ring draws in. Start/end adornments for icons.

Props

Options you can pass to customize this component.

Prop
Type
Description
label
string

Label text above the input.

size
'sm' | 'md'

Input size. Defaults to md.

startAdornment
ReactNode

Icon or element before the input.

endAdornment
ReactNode

Icon or element after the input.

error
string

Error message below the input.

Installation

npx shadcn@latest addhttps://ui.nexvyn.dev/r/input.json

How to use

<Input label="Email" placeholder="you@example.com" />

Source Code

Click the code icon in the top-right corner to view the source code.

Contact

Questions or feedback? Reach out anytime.

License & Usage

  • Free for personal and commercial use
  • No attribution required
  • Cannot be resold as a standalone product
  • Anatomy/blueprint diagrams are licensed separately (CC BY-NC 4.0) and are not for commercial use
// No code loaded.
npx shadcn@latest addhttps://ui.nexvyn.dev/r/input.json