Accordion Markup Generator (v1.0.2)

Accordion settings

Deeplink mode

Controls whether opening panels updates the URL hash (the Metro accordion JS handles behavior).

Accordion title (optional)

Title heading level

If a title is provided, triggers use the next heading level down (no gaps). If no title, triggers default to h3.

Build mode

Trigger titles (one per line)

Optional custom panel IDs: use Title | my-id. Example: Monthly PugetPass | pugetpass

Auto-generate panel IDs from titles Allow custom IDs via “Title | id”

IDs are normalized (lowercase, hyphens) and made unique automatically.

Generated accordion markup