Input Fields

Premium input components with fluid label animations, magnetic focus effects, and real-time validation feedback.

3 Variants
CLI Install
01

Floating Pulse

A modern take on the floating label. Uses GSAP for ultra-smooth transitions and features a subtle background pulse on focus.

Installation

$npx shadcn@latest add https://aftershade.pages.dev/registry/input-floating.json
02

Cyber Scan

A futuristic input with a scanline focus effect and animated security blocks. Perfect for administrative or technical interfaces.

System Access Key

Installation

$npx shadcn@latest add https://aftershade.pages.dev/registry/input-cyber.json
03

Security Master

A password input with a built-in strength meter and animated visibility toggles. Provides instant user feedback on security complexity.

Security StrengthEMPTY

Installation

$npx shadcn@latest add https://aftershade.pages.dev/registry/input-password.json

GSAP Label Fluidity

Labels move with mathematical precision using GSAP's power2 easing for a premium feel.

Focus Orchestration

Multiple CSS and JS animations trigger simultaneously on focus for deep visual feedback.

Accessibility First

Fully semantic HTML with ARIA support and high-contrast focus indicators.