Auth

Login variations

A centered authentication card with email + social login.

4 variations

4 results

Welcome back

or continue with

Don't have an account? Sign up

Classic card

dark

Centered email and password card with social sign-in shortcuts.

Don't have an account? Sign up

Cronus

“Cronus replaced four tools on day one — and our checkout conversion is up 23%.”

Dana ReyesHead of Growth, Northwind Labs

dark

Brand gradient panel with a customer testimonial beside the sign-in form.

Pick up right where you left off.

or sign in with email

light

Google, GitHub, and Apple buttons stacked above the email fallback.

Use your work email to continue.

light

Ultra-clean logo mark, email, and continue button with quiet footer links.

Catalog metadata for this block. Install copies the source into your project.

npx cronus-ui add login

Field	Type	Default	Description
`slug`*	`string`	`"login"`	Registry item id. Passed to cronus-ui add.
`name`*	`string`	`"Login"`	Display name shown in the gallery.
`description`*	`string`	`"A centered authentication card with email + social login."`	Short summary of what the block covers.
`variants`	`{ id: string; name: string; description: string }[]`	`["classic", "split", "social-first", "minimal"]`	Alternate layouts. Install a look with npx cronus-ui add <slug>--<id>. Omitted when the block has a single default.

Every published look for this block.

Id	Name	Description
`classic`	Classic card	Centered email and password card with social sign-in shortcuts.
`split`	Split panel	Brand gradient panel with a customer testimonial beside the sign-in form.
`social-first`	Social first	Google, GitHub, and Apple buttons stacked above the email fallback.
`minimal`	Minimal	Ultra-clean logo mark, email, and continue button with quiet footer links.