Card

What

A card is a rectangle with a summary of data. It resembles a playing card or business card in shape.

Why

To show multiple summaries of data in a space that can be clicked to see more information

Where

Almost anywhere except within menu or a widget.

Best Practices

  • Typically has a drop shadow, which is why it shouldn’t be on a widget, which also has a drop shadow.
  • Should be clickable.
  • Can be scrolled to allow for several cards within a fixed area.

Related Principles

Design Systems

Design Systems

A design system is a set of design standards for a company or a specific project. The primary elements of a design system are: color & text styles, icons & illustrations, and commonly used components. It can also include things like code standards, layout...

UX/UI Design Glossary

UX/UI Design Glossary

Chrome Visual elements that provide users information about or commands to use the screen's content. Chrome is not part of the content itself. Examples would be buttons, labels, and menus. Edge Case An uncommon situation when a user's experience falls outside the...