What is it?
A checkerboard is a 50/50 horizontal card element that displays an image on one side and text on the other.
Elements
- Card heading: Describes the topic of the card.
- Card content: Provides descriptive details about the topic.
- Card image or video: Provides visual context and can be aligned left or right.
- Card call-to-action links (optional): Links to more detailed information about the topic.
How do you use it?
- Use 50/50 Cards within content areas to call attention to important content.
- Ensure images complement the content.
- Include high-quality, engaging images.
Checkerboard Container
What is it?
A container that stacks multiple Checkerboard Cards in an alternating format.
Note: The components will automatically shift from side-to-side when put into a checkerboard container component. If you desire to have all of the images on the same side, do not put them in the checkerboard container.
Additional elements for the Checkerboard container:
- Section heading: Displays an optional heading of what the section is about.
- Section heading description: Describes the topic of the section in further detail.
How do you use it?
- Best for structuring content.
- Use consistent image quality and text length for balance.
- Allow the automatic alternating layout unless a manual override is necessary.
