Auth Card Block
Sign In Card
Compact credential sign-in card layout with email, password fields, social logins, and remember-me checkbox.
Sign in to Maya
Continue creating your branded content.
Password
Remember me
Forgot password?
Don't have an account? Sign up
When to Use & Guidelines
- Primary entry point for user authentication in web apps and SaaS products.
- Supports keyboard navigation (Enter key form submit) and standard browser autofill.
- Pair with clear inline field validation messages and error callouts.
Sign Up Card
Full registration flow card with name, email, password strength indicators, and terms of service consent.
Create your account
Start building beautiful branded content.
Name
Password
Already have an account? Sign in
When to Use & Guidelines
- New account registration and onboarding flows.
- Keep required fields to a minimum to maximize conversion rate.
- Includes instant password composition criteria and confirmation pairing.
Forgot Password Card
Self-serve password recovery card layout with email prompt and back-to-login navigation link.
Forgot password?
Enter your email and we'll send you a reset link.
Email Address
← Back to sign in
When to Use & Guidelines
- Triggered when a user clicks 'Forgot password?' on the Sign In card.
- Provides clear success confirmation feedback without disclosing account existence.
Email Verification Card
Six-digit OTP code verification card layout for multi-factor authentication (MFA) and email confirmation.
Verify email
We've sent a 6-digit confirmation code to your inbox.
Verification Code
When to Use & Guidelines
- 2FA / MFA security challenges during sign-in or high-risk account updates.
- Supports auto-focus advancing across digit inputs and resend timer action.