chromium/chrome/browser/resources/ash/settings/device_page/customize_pen_buttons_subpage.html

<style include="settings-shared input-device-settings-shared">
  #helpSection {
    align-items: center;
    background-color: var(--cros-sys-app_base_shaded);
    border-radius: 12px;
    display: flex;
    margin: 8px;
    padding: 16px 12px;
  }

  #helpIconSection {
    --iron-icon-height: 48px;
    --iron-icon-width: 48px;
    flex-basis: 48px;
  }

  #helpSectionText {
    flex: 1;
    margin-inline-start: 12px;
  }

  .help-title {
    color: var(--cros-text-color-primary);
    font: var(--cros-button-1-font);
    margin-bottom: 5px;
  }

  .secondary {
    font: var(--cros-body-2-font);
  }

  #buttonsSection {
    border-top: var(--cr-separator-line);
  }
</style>
<div id="helpSection">
  <div id="helpIconSection">
    <iron-icon icon="os-settings:pen-buttons-banner"></iron-icon>
  </div>
  <div id="helpSectionText">
    <div class="help-title">
      [[getcustomizePenButtonsNudgeHeader_(selectedTablet.*)]]
    </div>
    <div class="secondary">
      [[getDescription_(selectedTablet.*)]]
    </div>
  </div>
</div>
<div id="buttonsSection">
  <customize-buttons-subsection
      button-remapping-list="{{selectedTablet.settings.penButtonRemappings}}"
      action-list$="[[buttonActionList_]]"
      meta-key="[[metaKey_]]">
  </customize-buttons-subsection>
</div>