Used instead of list or checkerboard when there are many links, and the information should quickly show the user their desired path without the need for long sub-copy.
Name Description
slot[name=""] The default slot for the card section, this is where you can include the suite-card children
slot[name="edit-description"] A slot for handling inline editing of the description attribute, if the attribute is present this will not be shown
slot[name="edit-header"] A slot for handling inline editing of the header attribute, if the attribute is present this will not be shown
part::(base) The base div element
part::(cards-wrapper) The wrapper around the default slot
part::(content) The wrapper around the header and description
part::(description) The suite-text element used to display the description attribute
part::(header) The suite-text element used to display the header attribute
Cards Example
Testing Undergraduate First-Year Students Another Test Our blend of liberal arts and professional studies means that you can combine world-class education with real-world impact. Learn about undergraduate admissions Testing Graduate Students Another Test Whether it's uncovering breakthrough insights or furthering your field of interest, you'll work with world-renowned researchers, scholars and creative thinkers to take your career beyond what you could have imagined possible. Learn about graduate admissions Testing International Students Another Test At Syracuse University, our dedicated resources for international students ensure a seamless transition and welcoming experience. Here, you'll discover world-class academics, engage with our diverse and dynamic community and experience a vibrant campus. Learn about international admissions
Used to populate the card-section component.
Name Description
slot[name=""] The default slot for adding content to a card
slot[name="cta"] The slot for adding calls to action to a card
slot[name="media"] The slot for adding an image or video to a card
part::(base) The base suite-grid element
part::(content) The wrapper around the header, description, and cta wrapper
part::(cta-wrapper) the wrapper around the cta slot
part::(description) The suite-text element for the description
part::(header) The suite-text element for the header
part::(media) The suite-media element wrapped around the media slot