Forms — 527 CSS effects

Inputs, validation states, focus treatments, and form layouts.

Pure CSS with no dependencies or build step. Open any effect for a live preview, source code, and browser editing.

Page 3 of 6

Email Validation Input

File Upload Input

File Drop Zone Input

Number Stepper Input

Password Strength Input

Password Input with Eye Toggle

Percentage Input

Range Slider Input

Range Slider with Bubble

Search Input with Clear Button

Search Input with Animated Icon

Search Input with Loading

Tag Input Field

Telephone Input

Telephone Format Input

Standard Text Input

URL Preview Input

Invalid Background Input

Invalid Border Bottom Input

Animated Cross Mark Input

Error State Input

Invalid Glow Input

Invalid Red Glow Input

Invalid Icon Input

Invalid Icon Shake Input

Invalid Message Input

Invalid Red Border Input

Invalid Shake Input

Invalid Slide In Message

Invalid Underline Input

Invalid Vibrate Input

4-Box OTP Input

6-Box OTP Input

Active Indicator OTP

Bordered OTP Input

Glowing OTP Boxes

Circle OTP Input

Color Cycling OTP Input

Cyberpunk OTP Input

Single Input with Dashes

Filled Indicator OTP

Glass OTP Input

Gradient Border OTP

Light OTP Input

Line Connector OTP

Minimal OTP Input

Modern OTP Input

Retro Terminal OTP

Rounded OTP Input

Segmented OTP Display

Sharp Corner OTP Input

Square OTP Input

Underline OTP Input

Payment Amount Input

Flip Credit Card Input

Cardholder Name Input

Credit Card Number Input

Credit Card Preview

Coupon Code Input

Currency Picker Input

Discount Code Input

Card Expiry MM/YY Input

Gift Card Input

Loyalty Points Input

Quantity Stepper Input

Shipping Method Selector

Split Payment Input

Subscription Plan Input

Tax Calculator Input

Tip Selector Input

Order Total Display

Billing ZIP Input

Bar Indicator Radio

Border Draw Radio

Button Group Radio