Documentation

Documentation versions (currently viewingVaadin 24)

Accordion

Styling API reference for the Accordion component.

CSS Selectors

The following CSS selectors can be used in stylesheets to target the various parts and states of the component. See the Styling documentation for more details on how to style components.

Root element

vaadin-accordion

Panels

Panel element

vaadin-accordion-panel

Opened panel

vaadin-accordion-panel[opened]

Disabled panel

vaadin-accordion-panel[disabled]

Panel body content wrapper

vaadin-accordion-panel::part(content)

Panel Heading

Heading element

vaadin-accordion-heading

Toggle

vaadin-accordion-heading::part(toggle)

Toggle icon

vaadin-accordion-heading::part(toggle)::before

Panel header content wrapper

vaadin-accordion-heading::part(content)