08 / Card Grids & Overviews
Cards and lists present collections of content in a clear and modular way. Carousels and galleries are suited for showcasing products, teams, or customer quotes, while simple lists can double as indexes or tables of contents. These layouts help readers scan, compare, and select items with ease.
Card Carousel: A horizontal slider of content cards that pair visuals with a CTA. Perfect for presenting multiple items in limited space while driving exploration.
Duis aute irure
Dolor excepteur enim deserunt id adipisicing laboris est.
Ut enim ad minim
Minim nostrud suntex mollit deserunt amet proident. Occaecat est ullamco qui labore fugiat.
Ex ullamco
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do ut labore et dolore magna aliqua.
Magna voluptate
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium laudantium
Nemo enim ipsam
Cupidatat consectetur enim nulla nulla consectetur. Excepteur enim adipisicing magna anim.
Eiusmod est
Ullamco excepteur deserunt elit non. Sit nulla id sit occaecat et.
Image Card Carousel: A horizontal slider of image-based cards with text and a CTA. Great for showcasing visual stories or products while keeping navigation compact.
Duis aute irure
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia conse quuntur magni dolores.
Ut enim ad minim
Minim nostrud suntex mollit deserunt amet proident. Occaecat est ullamco qui labore fugiat.
Ex ullamco
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do ut labore et dolore magna aliqua.
Nemo enim ipsam
Cupidatat consectetur enim nulla nulla consectetur. Excepteur enim adipisicing magna anim.
Magna voluptate
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium laudantium
Eiusmod est
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores
Portrait Card Carousel: A horizontal slider of narrow cards with portrait, text, and CTA. Well-suited for showcasing team members or testimonials.
Duis aute
Dolor excepteur enim deserunt id adipisicing laboris est.
Enim minim
Minim nostrud sunt ex mollit dese runt amet proident. Occaecat est ullamco qui labore fugiat.
Magna tate
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium laudantium
Nemo ipsam
Cupidatat consectetur enim nulla nulla consectetur. Excepteur
Ex ullamco
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do ut labore et dolore magna aliqua.
Eiusmod est
Ullamco excepteur deserunt elit non. Sit nulla id sit occaecat et.
Text Card Carousel: A horizontal slider of minimalist text-only cards with CTA. Designed for quotes, highlights, or short messages.
Sed ut pers piciatis unde omnis iste natus error sit volup tatem.
Duis aute irure dolor in repre henderit in voluptate velit esse cillum dolore eu.
At vero eos et accusamus et iusto odio ducimus qui blan ditiis.
Nemo enim ipsam volup tatem quia voluptas sit aspernatur aut odit aut fugit.
Sed ut pers piciatis unde omnis iste natus error sit volup tatem.
Duis aute irure dolor in repre henderit in voluptate velit esse cillum dolore eu.
Card Gallery: A grid-based display of multiple content cards with CTA. Ideal for presenting collections (e.g. articles, products, or cases) in a scannable overview.
Duis aute irure
Dolor excepteur enim deserunt id adipisicing laboris est.
Ut enim ad minim
Minim nostrud suntex mollit deserunt amet proident. Occaecat est ullamco qui labore fugiat.
Ex ullamco
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do ut labore et dolore magna aliqua.
Magna voluptate
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium laudantium
Nemo enim ipsam
Cupidatat consectetur enim nulla nulla consectetur. Excepteur enim adipisicing magna anim.
Eiusmod est
Ullamco excepteur deserunt elit non. Sit nulla id sit occaecat et.
Image Card Gallery: A grid of image-focused cards with text overlays and CTA. Perfect for visual storytelling in a scannable layout.
Duis aute irure
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia conse quuntur magni dolores.
Ut enim ad minim
Minim nostrud suntex mollit deserunt amet proident. Occaecat est ullamco qui labore fugiat.
Ex ullamco
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do ut labore et dolore magna aliqua.
Nemo enim ipsam
Cupidatat consectetur enim nulla nulla consectetur. Excepteur enim adipisicing magna anim.
Magna voluptate
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium laudantium
Eiusmod est
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores
Portraits Card Gallery: A grid of portrait-focused cards with names, bios, and a CTA. Well-suited for team introductions, testimonials, or speaker lineups.
Duis aute
Dolor excepteur enim deserunt id adipisicing laboris est.
Enim minim
Minim nostrud sunt ex mollit dese runt amet proident. Occaecat est ullamco qui labore fugiat.
Magna tate
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium laudantium
Nemo ipsam
Cupidatat consectetur enim nulla nulla consectetur. Excepteur
Ex ullamco
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do ut labore et dolore magna aliqua.
Eiusmod est
Ullamco excepteur deserunt elit non. Sit nulla id sit occaecat et.
Eiusmod est
Ullamco excepteur deserunt elit non. Sit nulla id sit occaecat et.
Eiusmod est
Ullamco excepteur deserunt elit non. Sit nulla id sit occaecat et.
Text Card Gallery: A minimalist grid of text-based cards, each highlighting a key message, quote, or headline with a CTA. Ideal for indexes or topic overviews.
Sed ut pers piciatis unde omnis iste natus error sit volup tatem.
Duis aute irure dolor in repre henderit in voluptate velit esse cillum dolore eu.
At vero eos et accusamus et iusto odio ducimus qui blan ditiis.
Nemo enim ipsam volup tatem quia voluptas sit aspernatur aut odit aut fugit.
Sed ut pers piciatis unde omnis iste natus error sit volup tatem.
Duis aute irure dolor in repre henderit in voluptate velit esse cillum dolore eu.
Text List (Table of Contents): A structured list of headings and subheadings, providing readers with a clear overview and easy navigation through documents.
Table of Contents
Introduction
Chapter 1: Chapter name
H1 Subhead
H1 Subhead
H1 Subhead
Chapter 2: Chapter name
H2 Subhead
H2 Subhead
H2 Subhead
Chapter 3: Chapter name
H3 Subhead
H3 Subhead
H3 Subhead
Conclusion
Additional Resources
Timeline grid (Ideal for timelines): A structured list of headings and subheadings, providing readers with a clear overview and easy navigation through documents.
