A card is container for a few short, related pieces of information. It roughly resembles a playing card in size and shape, and is intended as a linked, short representation of a conceptual unit.

Short description

This component will be described at some point. Until then, here are a few examples.



The drop shadow is located below the card. It is not included in the actual card height.

Drop shadow
  • Height: 0.375 rem (6 px)
  • Colour: Black
  • Opacity: 0.15
  • Box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.15);
  • Fill colour: White 


Read about rem