Aggie UX is made of dozens of components, so it can get a bit overwhelming when you start using our design system. If you’re feeling overwhelmed, never fear — these four components can do a lot of heavy lifting and are flexible enough to handle a broad swath of content.

This module will cover these four components that are the backbone of most websites:

  • Page Headers: A page header at minimum contains a page’s primary heading and can also include page descriptions, CTAs, and an image or a freestanding fact. Every page must have a page header directly beneath the navigation.
  • Cards & Card Groups: A card group is a collection of modular cards with an optional section intro. Cards have a variety of media and CTA options. Card groups are often heavily used on landing pages.
  • Callout: A callout highlights one piece of content with one or two links, displayed as a linked heading, button(s) or link(s). Callouts have optional superheaders and subheaders, and can opt to have an icon as a media option.
  • Custom Content:The custom content component is the most flexible component. It provides access to a WYSIWYG editor where you can lightly format text as bold and italic, create different heading levels, create lists and link text. Most other components do not allow for formatting text in this way. Custom content also supports sidebar components.

Keep Learning

Learn about Page Headers in Aggie UX 101 Module 3 Chapter 2.

Go to Chapter 2