For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Installs with a ReUI Pro or Ultimate license.
Best for: A magic link sign-in with a sticky full-height photo on the left, held in a Frame panel
When to use
- A full page sign-in screen by password, emailed magic link or passkey, with social provider buttons
- A free trial signup page that opens an account from a work email or a social provider
- A split login layout that pairs the sign-in with a testimonial, a customer logo wall or a photo panel
When not to use
- A password login whose left panel holds a quote and trust logos, not a photo: use the Social Proof Login block
- A password form beside a still photo over an animated square grid: use the Photo Split Login block
- A data entry page inside the product, such as intake, invites or sign-in method rules: use the Form blocks
- Security options a signed in admin edits, such as session timeout and access toggles: use the Settings blocks
- A newsletter or waitlist email capture band on a landing page: use the CTA blocks
Agent notes
- Replace
AUTH13_SIDEBAR_IMAGE_LIGHTandAUTH13_SIDEBAR_IMAGE_DARKin data.tsx; each theme shows only its own photo - Below lg the
SidebarFramephoto stacks above the form at a 32rem minimum height, so phones open on the image - The 15 minute link expiry in the Work email
FieldDescriptionis static copy; keep it in sync with your token lifetime - Each form's submit handler only calls
preventDefault; call your auth backend from it - The social and SSO provider buttons have no
onClick; start your OAuth or SAML redirect from each - Replace the
AuthLogomark in auth-logo.tsx with your own brand logo
https://web.dev.reui.io/blocks/application/auth/auth-13.mdget_block("auth-13")npx shadcn@latest add @reui/auth-13Shadcn Photo Magic Link Block
Split-screen magic-link sign-in with left image sidebar and social login buttons. Part of the ReUI Shadcn Application Auth blocks collection.
Magic-link login page: work email field sends a secure sign-in link, plus Google, Apple, and GitHub social buttons. Two-column split with a full-cover image sidebar. ReUI Frame, shadcn Field, Input, Button, Separator.
It is composed from Button, Field, Frame, Input, Item, Separator, so every part of it is a primitive you can restyle with your own design tokens.
What You Can Build With the Photo Magic Link Block
- Install it with the ReUI registry command in the toolbar above, then swap the placeholder content, data wiring, and business logic for your own.
- Compare it across all eight ReUI styles and both the Base UI and Radix bases in the customizer before committing to one direction.
- Combine it with the other Shadcn Application Auth blocks to assemble a full screen instead of a single section.
All Shadcn Application Auth Blocks
The rest of this category, each on its own page with a live preview, the components it is built from, and the install command.
- Photo Split Login Split-screen login page with animated grid backdrop and editorial image panel
- Customer Quotes Login Split-screen login with an autoplay founder testimonial carousel and Trustpilot rating panel
- Magic Link Reviews Split-screen magic-link sign-in with testimonial and trust-brand sidebar on a dot-grid canvas
- Framed Password Login Framed password sign-in card with email or username, social provider row, and footer nav
- Workspace Sign-In Split-screen workspace sign-in with animated stacked media panel and social SSO
- Free Trial Signup Split-screen marketing trial signup page with animated gradient blob background and social login
- Magic Link Logos Split magic-link sign-in with a framed testimonial and customer logo wall trust sidebar
- Founder Story Login Split-screen login with social OAuth and testimonial sidebar over an animated grid background
- Split Testimonial Login Split-screen login with testimonial sidebar and animated dot backdrop
- Work Email Continue Full-page sign-in with app header, SSO and email-continue form, and customer logo trust strip footer
- Magic Link Card Blueprint-framed passwordless sign-in card with magic-link email and customer trust logos
- Split Method Picker Split login method picker with passkey, SAML SSO, and a framed brand-logo testimonial sidebar
- Photo Backdrop Login Centered Frame login card over a softened photo backdrop with social provider sign-in
- Rotating Quotes Login Split magic-link sign-in with an animated brand-logo grid sidebar and rotating star testimonial
- Invite-Only Sign-In Passwordless workspace sign-in page with magic-link work email and Google plus GitHub login
- Centered Magic Link Centered magic-link email login with logo, social sign-in buttons, and legal footer
- Centered Method Picker Centered login method picker with WebAuthn passkey sign-in and email reveal step
- Social Proof Login Split-screen sign-in with testimonial sidebar, social login, and password show/hide toggle
- Centered Password Login Centered sign-in card with Google and Apple buttons, password visibility toggle, and email login
Related Shadcn Application Block Categories
- App Shell (35) App shell layouts with sidebar, rail, or top bar navigation for dashboards, settings panels, and multi-page apps.
- Card (43) Card components for content display, data summaries, and interactive elements.
- Dashboard (8) Dashboard components and layouts that combine stats, charts, and tables into a complete overview screen.
- Dialog (14) Dialog components for modal windows, alerts, confirmations, and content overlays.
- Empty State (14) Empty state screens and no-data placeholders with recovery actions, onboarding prompts, and contextual guidance.
- Event Calendar (6) Event calendar blocks with month, week and day views, drag-and-drop scheduling, and inline editing.
All Shadcn Block Groups
Browse the full ReUI Shadcn blocks library by product surface. Each group bundles category-level blocks you can mix and match across your project.
- Shadcn Application Blocks (303) Browse 303 Shadcn Application blocks across 23 categories.
- Shadcn Data Grid Blocks (47) Browse 47 Shadcn Data Grid blocks across 9 categories.
- Shadcn Charts Blocks (52) Browse 52 Shadcn Charts blocks across 10 categories.
- Shadcn Solutions Blocks (76) Browse 76 Shadcn Solutions blocks across 11 categories.
- Shadcn AI & Agents Blocks (22) Browse 22 Shadcn AI & Agents blocks across 3 categories.
- Shadcn eCommerce Blocks (87) Browse 87 Shadcn eCommerce blocks across 13 categories.
- Shadcn Marketing Blocks (67) Browse 67 Shadcn Marketing blocks across 8 categories.
Frequently Asked Questions
When should I use the Photo Magic Link block?
Use it for a magic link sign-in with a sticky full-height photo on the left, held in a Frame panel.
The Auth category fits:
- A full page sign-in screen by password, emailed magic link or passkey, with social provider buttons
- A free trial signup page that opens an account from a work email or a social provider
- A split login layout that pairs the sign-in with a testimonial, a customer logo wall or a photo panel
For a password login whose left panel holds a quote and trust logos, not a photo, use the Social Proof Login block. For a password form beside a still photo over an animated square grid, use the Photo Split Login block. For a data entry page inside the product, such as intake, invites or sign-in method rules, use the Form blocks. For security options a signed in admin edits, such as session timeout and access toggles, use the Settings blocks. For a newsletter or waitlist email capture band on a landing page, use the CTA blocks.
What is the Photo Magic Link block built with?
Can I restyle the Photo Magic Link block?
How should I use Shadcn auth blocks in a real project?
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
From $249, once. Lifetime updates.