- Use Cases: Used to To highlight features, benefits, or service pillars with easily scannable visuals.
- Product or solution overviews: To present key capabilities or modules as a set of cards.
- Navigation/quick actions: To provide visual shortcuts to important sections.
- Content hubs: To categorize content types or topics with recognizable icons
- Dependencies
- Icon Cards required to display items. It is a placeholder for child Icon Card components
- Background Color: Defines the background color of the card.
- Images: Icon card image being the focal point of the container (required)
Presentation component to group and render a set of “icon cards.” An Icon Card typically contains an icon (SVG or image), a title, short text, and optionally a link or CTA.
Quickly discovering relevant
data sources, media assets
Encodes instructions for
building proteins,enabling
inheritance, cellular function,
and biological diversity
through replication and expression
building proteins,enabling
inheritance, cellular function,
and biological diversity
through replication and expression
A mechanism that measures
or counts down time intervals
, often triggering an action
when a specified duration elapses
or counts down time intervals
, often triggering an action
when a specified duration elapses
A structured content
item or file (e.g., page, PDF, policy)
containing information
intended for reading, reference
, or distribution.
item or file (e.g., page, PDF, policy)
containing information
intended for reading, reference
, or distribution.
Creating IconCard
- In Content Editor, create a "Icon Card Folder" under the "_datasources" of your page
- Create a new IconCard item from the Icon Card template.
- Fill in the required fields
- Image
- Fill in optional fields: Background Color
Creating IconCardContainer
- In Experience Editor, insert IconCardContainer rendering into the awt container
- In Experience Editor, insert the Icon Card rendering into the IconCardContainer placeholder.
- Associate the Icon Card item as the data source.
- None : There are no variants for this component.
- There are currently no known issues with this component