Okuzeka
UX/UI Design vocabulary · UI Elements and Patterns

Modal

Meaning in UX/UI design, with examples

/ˈmoʊdl/nounCore term

In UX/UI design, modal means: A window that opens on top of the current screen and blocks the rest of the page until the user responds to it or closes it.

In Turkish: modal pencere, açılır pencere, diyalog penceresi

How it is used

Used for confirmations, short forms and important warnings. Also called a modal window or modal dialog; the darkened area behind it is the overlay. Too many modals interrupt people, so designers use them carefully.

Example sentences

  1. Show a modal to confirm before the user deletes the whole project.

  2. On mobile, the modal is taller than the screen and the close button disappears.

Common collocations

  • open a modal
  • close the modal
  • confirmation modal
  • modal dialog
  • buttonA clickable or tappable element that lets users perform an action, such as submitting a form, saving changes or opening a menu.
  • toggleA switch that turns a setting on or off with one tap and usually takes effect immediately, like turning on dark mode or notifications.
  • tooltipA small text box that appears when users hover over, focus on or tap an element, giving a short explanation or the name of an icon.
  • focus stateThe visible style, usually an outline or ring, that shows which element is currently selected when someone moves through a page with a keyboard.

This word in other fields

The same English word can have a different meaning in another field:

More terms: UI Elements and Patterns

Practise with graded reading

Reading at the right level is the fastest way to make new words stick. Pick free English books by level: