My pattern library

11.1.1 #Panel.panel.header Panel header

Toggle example guides Toggle HTML markup

This is meant to be used for the heading part of a panel.

It is of color var(--panel-bg-color-lighter).

Examples
Default styling

this is 1st child

this is 2nd child

this is 3rd child
.panel__header--two-children
A thin line separates first child from second

this is 1st child

this is 2nd child

this is 3rd child
Markup
<div class="panel__header [modifier class]" style="width: auto;">
  <h1>this is 1st child</h1>
  <h4>this is 2nd child</h4>
  <h5>this is 3rd child</h5>
</div>
Source: css/modules/panels.css, line 31