Full screen modal screen examples

Dock

Workspace creation wizard where the user selects an account from a searchable list to apply to a chosen sales room template.

• Add & Create
• Select

Lovable

Creation modal where the user names a new workspace and proceeds to plan selection.

• Add & Create

Navattic

Detail page where the user views an interactive demo inside a large modal overlay, currently displaying an empty canvas with a prompt to learn about captures.

• Empty State
• Media Detail

Mailchimp

Creation wizard step where the user reviews a new audience segment based on tags, currently showing zero matching contacts.

• Filter & Sort
• Empty State

Bird

Full-screen overlay where the user selects an organization and workspace to switch their current context, or opts to create a new organization.

• Select

Durable

Detail page where the user views an AI-generated image, reads the prompt that created it, and can download the result or provide feedback.

• Media Detail
• AI Generation

Typeform

Full-screen settings modal where the user reviews their saved billing address and payment method, with options to edit each section.

• Payment Form
• Billing Settings

Kinsta

Creation form where the user enters credit card and billing details to set up a new company profile.

• Checkout
• Payment Form

Travelperk

Full-screen overlay where the user assigns an approval process to selected people, showing a disabled save button because no processes are available to select.

• Approval Flow
• Bulk Actions

Cake

Creation wizard step where the user reads a legal disclaimer before starting a new equity raise.

• Setup Wizard
• Confirmation

UserJot

Settings page where the user configures a custom domain for their workspace, currently showing a success confirmation toast.

• Settings

Glide

Design editor settings view where the user configures data sync modes and exports app data for a mobile application.

• Settings
• Import & Export