Signup 7 - Split signup with product preview

Pro

A two-column signup section with Google, email, and enterprise SSO options, legal links, review badges, a product screenshot, and three feature blurbs.

Vue
Shadcn Signup 7 block

Component Data

  • ID:signup7
  • Access:pro
  • Created:Mar 30, 2025
  • Type:block

Signup 7 block design & features

Signup7 is a two-column account creation section built with Shadcn UI. The left column has a heading, supporting text about personal and team plans, a Google continue button, an or divider, a continue with email button, an enterprise SSO link, a login prompt, and terms and privacy links. The right column shows review badges, a product screenshot in a dashed frame, and three feature blurbs with icons for workspaces, tasks, and team collaboration.

The section sits on a muted page background. On wide screens the two columns share a rounded panel, and on extra-wide screens that panel gains a border. The screenshot is cropped into a left-rounded frame with a dashed outer border. Feature copy uses small icons above short titles and muted descriptions. Buttons are full width in the left column.

The layout reads as a product-style signup rather than a standalone form card. Moderate complexity comes from the mixed content: auth choices, legal links, badges, a screenshot, and feature copy. You would need real review badge art, a product image, and three short benefit statements to use it as more than a placeholder.

On smaller screens the screenshot and feature row hide, leaving the auth column on its own.