Collapsible

A single disclosure, built on native details.

Source: src/stylus/components/collapsible.styl

Default

The accordion is a stack of these on a shared surface; a collapsible is the one-off, so it carries no border of its own and inherits whatever it sits in. Native <details> means keyboard support and find-in-page come free.

Advanced options

Everything here is optional.

<details class="collapsible">
  <summary>Advanced options</summary>
  <div class="collapsible-content">
    <p>Everything here is optional.</p>
  </div>
</details>