Field

Combine labels, controls, and help text to compose accessible form fields and grouped inputs.

Installation

npx shadcn add https://hq-ui.vercel.app/r/nova/field

Examples

Basic

field-set-demo
Address InformationWe need your address to deliver your order.

Field Input

field-input-demo
ProfileEnter your personal information
Choose a unique username for your account.
Must be at least 8 characters long.

Field Textarea

field-textarea-demo
Share your thoughts about our service.

Field Select

field-select-demo
Select your department or area of work.

Field Checkbox

field-checkbox-demo
Select the items you want to show on the desktop.

Field Date

field-date-demo
mmddyyyy
––––AM

Field Number

field-number-demo

Field Radio

field-radio-demo
Yearly and lifetime plans offer significant savings.
field-search-demo

Field Slider

field-slider-demo
20