Content components

Usage

Use the Accordion component to create an expandable step-by-step list or checklist for users.

Each list item can expand to reveal text or media.

The component fills the full width of the available content area.

Example

List accordion

A visual example of an accordion.

List accordion working example: First home buyers checklist.

Numbered accordion

The 'numbered' style of accordion displays a sequential number alongside each accordion segment title. Numbered accordions should only be used for procedural-type instructions where the order of doing things is important.

A visual example of a numbered accordion.

How to build

Accordions can be embedded into the body content area of any landing page.

For more detailed information view the Victorian Government digital guide.

Introduction Text
A list of expandable topics.
Topic
Secondary Campaign
55
Show Contact Us?
On
Contact Us
Title
Interested in using SDP?
Name
Amber Benjafield
Email
amber.benjafield@dpc.vic.gov.au
Phones
Show Site-section Navigation?
On
Show topic term and tags?
On
Site-section Navigation Title
Design System
Background Colour
White
Was this page helpful?