Select theme:

Angular
Blazor

Accordion (Angular)link

This guide demonstrates how to use the Accordion component.

Accordion Propertieslink

Name	Type	Default	Description
Name	string	'accordion' + index suffix	Unique name the Accordion.
Multiple	boolean	false	Allow multiple items to be expanded.
SelectedIndex	number	0	The index of the initially expanded accordion item.
Items	array of Accordion items	One item	Accordion items.
Icon	string	null	Accordion icon.

Accordion Eventslink

Name	Type	Default	Description
Collapse	event	null	Fired when an item collapses. Has one event argument `index` which is the index of the collapsed item.
Expand	event	null	Fired when an item expands. Has one event argument `index` which is the index of the expanded item.

Accordion item Propertieslink

Name	Type	Default	Description
Text	string	string	The header text displayed by the accordion item.
Icon	string	null	Accordion item icon.

In this article —

**Accordion** Properties
**Accordion** Events
**Accordion item** Properties

Solutions

CRUD Operations and Data Management Seamless Integration Digital Transformation and Modernization Design Systems and Consistency Use Cases Time to Market Reduced Radzen in Education

Products

Radzen Blazor Studio Radzen Blazor for Visual Studio Radzen Blazor Components

Recognition

Success Stories

Resources

Community forum ↗ Online demos Roadmaps Blog YouTube channel ↗

Company

Get started today

Radzen is free to use. You can also test the premium features for 15 days.

© 2016-2025 Radzen Ltd. All Rights Reserved.
Designed and developed with ❤️ in Radzen Blazor Studio.

Terms of use Subscription Policy Privacy Policy

Select theme: