Modals & Dialogs | Components

Modals

Modals are best used to display a temporal status over the current information, best used to show detailed information or generate awareness of new features.

Recommendation (Ad)

Desktop (21)
Mobile (4)

397. Modal w/ Card Options

Desktop, Decision Making, Feedback, Awareness, Onboarding, Pathfinding, Web, Español, Modal, Thumbnail, Animation, Close Overlay, Cards, Dim Overlay

389. Text Edit Inline Input

Desktop, Accessibility, Decision Making, Web, English, Text Input, Hypertext Links, Modal

378. Modal Blackout w/ Animation

Desktop, Decision Making, Awareness, Onboarding, Web, Español, Modal, Hypertext Links, Animation

362. Modal Blackout w/ Form & Animations

Desktop, Accessibility, Apple OS, Español, Modal, Text Input, Transition

357. Modal w/ Steps & Animation (No blackout)

Desktop, Pathfinding, Awareness, Decision Making, Web, English, Modal, Animation, Image / Illustration

344. MercadoLibre - Horizontal Item Slider

Desktop, Awareness, Pathfinding, Web, Español, Carrousel, Modal, Pagination, Image / Illustration

343. Modal/Dialog Drag & Drop to Fixed Position

Desktop, Accessibility, Pathfinding, Awareness, Web, Español, Drag & Drop Gesture, Modal, Side Panel, Alert Dialog

332. Drag & Drop to Create File from Web Image

Desktop, Pathfinding, Accessibility, Awareness, Web, Apple OS, Drag & Drop Gesture, Image / Illustration, File OS, Modal, Click Event

319. Modal Blackout w/ Multiple Choice

Desktop, Decision Making, Consent, Awareness, Web, Español, Modal, Avatar, Button, Hypertext Links

315. Signal - PIN Reminder

Desktop, Awareness, Accessibility, Apple OS, English, Text Input, Modal, Banner, Hypertext Links

316. Modal Blackout for Delete Confirmation

Desktop, Decision Making, Awareness, Web, Español, Modal, Text Input, Button

313. Modal Blackout w/ Scroll

Desktop, Pathfinding, Web, Español, Modal, Scrollbar, Image / Illustration, Photo, MercadoLibre

306. Drag & Drop for Reordering List Items (Mouse)

Desktop, Awareness, Accessibility, Web, English, Drag & Drop Gesture, Filters, List Items, Modal, Checkbox, Notion

268. Drag & Drop to Upload File

Desktop, Awareness, Pathfinding, Web, Apple OS, English, Drag & Drop Gesture, Modal, Hypertext Links, Animation, Image / Illustration, GIPHY

256. Modal Blackout w/ Forms & Steps

Desktop, Onboarding, Decision Making, Accessibility, Web, Español, English, Modal, Button, Steps, Dropdown Menu, Text Input, Image / Illustration, Close Overlay, Facebook

241. Modal Blackout w/ Steps

Desktop, Onboarding, Awareness, Web, English, Modal, Hypertext Links, Pagination, Image / Illustration, Wordpress

231. Floating Dialog Popover w/ Steps

Desktop, Awareness, Pathfinding, Web, Español, Hypertext Links, Pagination, Side Panel, Alert Dialog, Modal, Dark Mode, Wordpress

No preview

190. Delete Confirmation w/ Name (moved)

Desktop, Awareness, Web, English, Text Input, Modal, Hypertext Links, Webflow

201. Modal Blackout w/ Actions

Desktop, Decision Making, Apple OS, English, Modal, Hypertext Links, Apple, Apple iTunes

166. Generated Effect: Confetti Explosion

Desktop, Appreciation, Decision Making, Web, English, Modal, Hypertext Links, Animation, Image / Illustration

188. Trello - Color shapes for Colour-blind

Desktop, Accessibility, Web, Español, Modal, Tooltip, Hypertext Links, Text Input, Trello