Blocks

Onboarding - Completion

Finish line blocks for onboarding: an all set success screen, a celebration with a recap, a next steps grid and a last chance invite form.

The last screen of an onboarding flow should confirm that it worked and point at one clear next move. These blocks do that without confetti, so they stay calm for people who prefer reduced motion, and the one animated check is skipped entirely when the system asks for less movement.

Workspace names, people and numbers are fictional and come in through typed props. Success messages use role="status" so screen readers announce them.

Style One

All set screen with a check that springs in, a short message with the workspace name and two actions.

External View

Style Two

Celebration card with a gradient header, the time it took, a recap of everything that was set up and a share button that copies the invite link.

External View

Style Three

Next steps grid. Six cards with icons, a recommended badge on the best first move and a skip link for people who would rather explore on their own.

External View

Style Four

Invite and finish. A short invite form with roles, a list of pending invites, a copy link row and a finish button that adapts to whether you invited anyone.

External View