Okuzeka
UX/UI Design vocabulary · UI Elements and Patterns

Card

Meaning in UX/UI design, with examples

/kɑːrd/nounCommon term

In UX/UI design, card means: A rectangular container that groups related content about one item, such as a product photo, title and price, and often links to more details.

In Turkish: kart

How it is used

Cards are common in feeds, dashboards and product lists because they fit well into responsive grids. Designers decide whether the whole card is clickable or only a button inside it, and keep card heights consistent.

Example sentences

  1. Each recipe card shows a photo, the cooking time and a save button.

  2. On mobile, the cards stack in a single column.

Common collocations

  • product card
  • card layout
  • clickable card
  • card component
  • componentA reusable building block of an interface, such as a button, card or input field, designed once and used in many places with the same look and behaviour.
  • gridA set of invisible columns, rows and gaps that designers use to place and align elements consistently across a page or screen.
  • layoutThe arrangement of text, images, buttons and other elements on a page or screen, including their size, position and the space between them.
  • affordanceA quality of an object or interface element that suggests how it can be used, for example a raised button that looks pressable or a handle that invites pulling.

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: