Variant UI components examples

Variant

A modal dialog displaying a pricing comparison table for different subscription plans.

• Modal

Variant

Account settings modal displaying user profile information and privacy controls.

• Modal

Variant

A user account dropdown menu displaying profile information, subscription status, and navigation links for settings, feedback, legal terms, and logout.

• Dropdown menu

Variant

• Dropdown menu

Variant

A note-taking application displaying a list of notes and the detailed content of a selected note, along with customization options.

• Card

Variant

A contextual popover menu offering options to rename or delete a project.

• Dropdown menu

Variant

A popover menu offering options to attach photos and files or import a URL, displayed above a text input area.

• Dropdown menu

Variant

A dark-themed interface for generating designs based on user input, featuring an input field and suggested prompts.

• Artificial intelligence

Variant

A dark mode interface displaying a user prompt and AI generation status for design inspiration.

• Artificial intelligence

Variant

A dark-themed input field with placeholder text and action icons.

• Artificial intelligence

Variant

A minimal dark mode interface featuring a vertical navigation bar with icons and a user avatar.

• Vertical navigation