Forms & selection@neumorphism-ui/select

Select

Uses native select, optgroup, and option elements with an inset field and decorative chevron. Preserves the platform picker on mobile and native form submission.

@neumorphism-ui/select

Registry JSON

Preview

Region

Disabled

Installation

npx shadcn@latest add @neumorphism-ui/select

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/select @neumorphism-ui/label

Import

import {
  Select,
  SelectGroup,
  SelectItem,
} from "@/components/ui/select"
import { Label } from "@/components/ui/label"

Example

<div className="grid gap-2">
  <Label htmlFor="role">Role</Label>
  <Select id="role" name="role" defaultValue="designer">
    <SelectItem value="designer">Designer</SelectItem>
    <SelectItem value="developer">Developer</SelectItem>
    <SelectItem value="founder">Founder</SelectItem>
  </Select>
</div>

API Reference

Component	Prop	Type	Default	Description
`Select`	`value / defaultValue`	`string \| string[]`	`—`	The controlled selected value or initial uncontrolled value.
`Select`	`onChange`	`React.ChangeEventHandler<HTMLSelectElement>`	`—`	Called when the native select value changes.
`Select`	`disabled / required / multiple`	`boolean`	`false`	Sets native select constraints and multiple selection.
`SelectItem`	`value`required	`string \| number \| readonly string[]`	`—`	The value submitted by the option.
`SelectGroup`	`label`required	`string`	`—`	The label for an optgroup of options.