MEDIA CARDS

A grid of image, icon or data cards.

Image Cards

Image cards display a grid of images.

  • Women holding grapefruits

    Action #1

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • People packing oranges

    Action #2

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • Group of people holding bags of groceries

    Action #3

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Icon Cards

Icon cards have an SVG image at the top rather than an image.

  • First Item

    First Item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Learn More
  • Second Item

    Second Item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Learn More
  • Third Item

    Third Item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Learn More

Icon Cards

Icon cards have an SVG image at the top rather than an image.

  • First Item

    First Item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Learn More
  • Second Item

    Second Item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Learn More
  • Third Item

    Third Item

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

    Learn More

Data Cards

Data cards can be used for showing annual data trends graphically.

  • Trend Going Up

    This data card is showing a trend that is going up year by year.

    100K
    2020
    800K
    2023

  • Trend Going Down

    This data card is showing a trend that is going down year by year.

    600K
    2020
    50K
    2023

  • Trend Going Up

    This data card is showing a trend that is going up year by year.

    50K
    2020
    950K
    2023
  • Eyebrow

    Title Cards

    Title cards can be used as the first card in cases where you don't have enough cards to complete a row.

  • Women holding grapefruits

    Action #1

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

  • People packing oranges

    Action #2

    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.