Forms & selection@neumorphism-ui/input

Input

Forwards every native input attribute while consistently styling the neumorphic inset surface, file input, disabled state, and aria-invalid state.

@neumorphism-ui/input

Registry JSON

Preview

Invalid

Disabled

Installation

npx shadcn@latest add @neumorphism-ui/input

The CLI resolves npm dependencies, base tokens, utilities, and component source in order.

New to this Registry? Set up the namespace before continuing.

Usage

npx shadcn@latest add @neumorphism-ui/input @neumorphism-ui/label

Import

import { Input } from "@/components/ui/input"
import { Label } from "@/components/ui/label"

Example

<div className="grid gap-2">
  <Label htmlFor="email">Email</Label>
  <Input
    id="email"
    name="email"
    type="email"
    placeholder="you@example.com"
    autoComplete="email"
  />
</div>

API Reference

Component	Prop	Type	Default	Description
`Input`	`type`	`React.HTMLInputTypeAttribute`	`"text" (browser default)`	The native input type, such as email, password, or file.
`Input`	`value / defaultValue`	`string \| number`	`—`	The controlled value or initial uncontrolled value.
`Input`	`placeholder`	`string`	`—`	A short example that helps communicate the expected value format.
`Input`	`disabled / required / readOnly`	`boolean`	`false`	Sets native input constraints.
`Input`	`aria-invalid`	`boolean \| string`	`—`	Enables the error border and focus ring.