An interactive collection of accordions which progressively reveals the text and image content of each item in the group in an engaging, auto-play animation loop.
The C094 is intended for showcasing compelling software product or product feature accordion content in a modern and visually engaging presentation. The component allows editors to author an optional section eyebrow label, section heading and optional description text in addition to a group of 2–8 (recommended max) accordion items, each consisting of a title, description text, optional Text CTA and corresponding feature image. The Timed Accordion component is auto-animated on page load to successively expand and collapse each item in the group until user chooses to interact with it by selecting an individual accordion item.
**Note: It is recommended that the image assets used for these accordions should be formatted to display on transparent backgrounds in order to align with the modern design aesthetic intended for this component and avoid unwanted “boxing in” of the product imagery or illustrations.
On click of an accordion item, the auto-play progression is stopped and the item clicked will display its content and image. Note: The auto-play animation for the group will not be restarted unless the user refreshes the page.
When authored, the optional accordion item Text CTA should drive user to a corresponding child page.
Section Heading: 80 (flexible)
Section Body: 350 (flexible)
Accordion Title: 45 (flexible)
Accordion Body: 500 (flexible)
Accordion Text CTA: 40
Asset Size: 960px x (variable)
Aspect Ratio: 1:1, 3:4, 4:3, or 16:9
Recommended File Size: <75kb
Width: 580px
Height: variable based on aspect
Desktop: 1:1, 3:4, 4:3, or 16:9
Tablet: 1:1, 3:4, 4:3, or 16:9
Mobile: 1:1, 3:4, 4:3, or 16:9