dark App Logolight App Logo
Get started
Develop
Foundations
Styles
Components
Patterns
Resources
Contact

Cards

Cards are versatile containers, holding anything from images to headlines, supporting text, buttons, lists, & other components

  • There are two styles of cards: glass and flat.
  • Both styles offer the same level of readability, but the glass style provides dynamic background effects due to its translucent surface. This style might be preferred for certain use cases where the card needs to be moved around the layout.
  • Card contents can include anything from images to headlines, supporting text, buttons, and lists.
  • Cards have flexible layouts and dimensions based on their contents.

Resources

Type Resource Status
DesignFigma: Atmosphere Foundations and Components LibraryAvailable
DesignFigma: Atmosphere Icons LibraryAvailable
ImplementationGitLab: Angular web componentAvailable