Forms - Pure Admin Visual

Complete set of form elements with various styles and states for data input.

Size	Class	Font Size	Padding (v/h)	Input Height	Button Height
XS	`--xs`	1.2rem (12px)	0.6rem / 0.8rem	-	-
SM	`--sm`	1.4rem (14px)	0.8rem / 0.8rem	-	-
Default	(none)	1.4rem (14px)	0.8rem / 0.8rem	-	-
LG	`--lg`	1.6rem (16px)	0.8rem / 0.8rem	-	-
XL	`--xl`	1.8rem (18px)	0.8rem / 0.8rem	-	-

Text Input

Email Input

Password Input

Number Input

Select Dropdown

Date Input

Textarea (Full Width)

First Name

Last Name

Phone

Country

ZIP Code

Input with Prepended Text

Input with Appended Text

USD

Input with Both Prepend and Append

$ .00

Input with Button

Prepend + Input + Button

🔍

Input + Append + Button

USD

Button + Input + Append

items

Prepend + Input + Append + Button

https:// .com

Button + Input + Button (Quantity)

Disabled Input

Readonly Input

Input with Help Text Must be 3-20 characters long

Input with Error This field is required

Input with Success Looks good!

Checkboxes (Custom Tri-State)

Option 1 (checked) Option 2 Option 3 (disabled)

Radio Buttons

Choice A (selected) Choice B Choice C (disabled)

First Name

Last Name

Phone

Department

Job Title

Address

City

Zip

New task assigned

Build completed

Server maintenance

New comment

Input Sizes Reference

User Profile

Contact Information

Quick Settings

Compact Three Column Layout

Input Groups

Form States

Input Sizes

Checkboxes and Radio Buttons

Checkbox & Radio Sizes

Horizontal Form Layout

Settings

John Doe