Component Library

Browse, preview, and copy components

Inputs

A comprehensive collection of input components covering every variant, state, size, and composition pattern you need for forms.

Basic Variants

Shapes & Sizes

Control border radius and height.

States

Visual feedback for interaction states.

Icons & Composition

With Icons

Inputs with leading or trailing icons.

Input Groups

Combine inputs with buttons or static text.

https://

Labels & Validation

Label Styles

Different ways to label inputs.

Validation Messages

Helper text for success, error, and warning states.

Valid email

Invalid email

Special Inputs

Advanced

Password Input

Secure text entry with visibility toggle.

OTP Input

One-time password fields.

File Input

Upload fields.

Phone Number

Composed input with country selector.

Textarea & Select

Textarea

Multi-line text input.

Select

Native select dropdown.

Floating Label Inputs

Basic Floating

Label floats up on focus or when filled

With Validation Error

Error state with message

Please enter a valid email

Multi Select

With Search & Tags

Select multiple items with search, select all, and clear

React
Next.js

Disabled

Non-interactive state

Option A

Image Uploader

Square

1:1 aspect ratio

Click or drag to upload an image

PNG, JPG, WEBP up to 5MB

Banner

3:1 wide ratio

Click or drag to upload an image

PNG, JPG, WEBP up to 5MB

Uploading

Loading state

Uploading...