Input

A glass-morphism text input with focus glow, error state, and full HTML input compatibility.

Preview

npx shadcn@latest add @shadszn/input

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

export default function Example() {
  return <Input type="email" placeholder="you@example.com" />
}

<Input error placeholder="Invalid email" />

<Input disabled placeholder="Cannot edit" />

Prop	Type	Default	Description
error	boolean	false	Applies red border styling to indicate an error.
type	string	"text"	HTML input type (text, email, password, etc.).
placeholder	string	---	Placeholder text.
disabled	boolean	false	Disables the input.