Sign in

A sign in card that morphs from email to a six digit code to your account.

Library

Arc Library

Framework

React

Type

block

License

MIT

Dependencies

lucide-react, motion

Install

npx shadcn@latest add https://uiarc.dev/r/sign-in.json

Files

• registry/blocks/sign-in/sign-in.tsx
• registry/blocks/sign-in/sign-in.module.css
• lib/media.ts
• registry/components/otp-input/otp-input.tsx
• registry/components/otp-input/otp-input.module.css
• registry/components/input/input.tsx
• registry/components/input/input.module.css
• registry/components/button/button.tsx

Source

https://github.com/kuratlielia/arc-library

Categories

• Form Components
• React Form Components
• Animated Form Components
• Input Components
• React Input Components
• Animated Input Components
• Login Form Components
• React Login Form Components
• Login Page Components
• React Login Page Components
• Page Components
• React Page Components

More from Arc Library

• Contact section
• Centered login
• Newsletter signup
• Sign up form
• Site footer
• Accordion
• Action button
• Action swap
• Activity heatmap
• Alert
• Animated counter
• Announcement bar