<nav class="kss-bar-tool  kss-c-box  kss-c-box--theme-fill-main  " rol="navigation">
  <button class="kss-bar-tool__button-drawer  kss-c-button" type="button">
    <span class="kss-c-icon  kss-c-icon--type-drawer">
      MENU
    </span>
  </button>
  <!-- nest -->
<section class="kss-section-inline  kss-c-box  kss-bar-tool__theme-switcher">
  <header class="kss-section-inline__header  kss-c-box">
    <h2 class="kss-section-inline__label  kss-c-text">THEME</h2>
  </header>
  <div class="kss-section-inline__container  kss-c-box">
    <!-- nest -->
        <div class="kss-navi-icon  kss-c-box  ">
          <button class="kss-navi-icon__button  kss-c-button  is-kss-current" type="button" data-kss-theme-value="system">
            <svg class="kss-navi-icon__button__icon" width="20" height="20" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M41.008,19.488a9.5,9.5,0,1,1,9.5-9.5A9.5,9.5,0,0,1,41.008,19.488ZM41,2.875c0,1.741-.008,4.442-0.008,7.147s0,5.376.006,7.1A7.124,7.124,0,0,0,41,2.875Z" transform="translate(-31)"/></svg>
          </button>
          <button class="kss-navi-icon__button  kss-c-button" type="button" data-kss-theme-value="light">
            <svg class="kss-navi-icon__button__icon" width="20" height="20" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M19,10.993H17a1,1,0,1,1,0-2h2A1,1,0,1,1,19,10.993ZM15.652,5.752a1,1,0,0,1-1.414-1.414l1.414-1.414a1,1,0,1,1,1.414,1.414ZM10,14.994a5,5,0,1,1,5-5A5,5,0,0,1,10,14.994Zm0-8a3,3,0,1,0,3,3A3,3,0,0,0,10,7ZM9.993,4a1,1,0,0,1-1-1V1a1,1,0,1,1,2,0V3A1,1,0,0,1,9.993,4ZM4.348,5.753L2.934,4.339A1,1,0,0,1,4.348,2.924L5.763,4.339A1,1,0,1,1,4.348,5.753ZM4,9.993a1,1,0,0,1-1,1H1a1,1,0,1,1,0-2H3A1,1,0,0,1,4,9.993Zm0.338,4.244a1,1,0,1,1,1.414,1.414L4.339,17.066a1,1,0,1,1-1.414-1.414ZM9.993,16a1,1,0,0,1,1,1v2a1,1,0,1,1-2,0V17A1,1,0,0,1,9.993,16Zm5.669-1.761,1.414,1.414a1,1,0,1,1-1.414,1.414l-1.414-1.414A1,1,0,0,1,15.662,14.238Z" /></svg>
          </button>
          <button class="kss-navi-icon__button  kss-c-button" type="button" data-kss-theme-value="dark">
            <svg class="kss-navi-icon__button__icon" width="20" height="20" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M80.522,14.1A9.486,9.486,0,1,1,70.506.617l0.005,0.009A0.453,0.453,0,0,1,70.6.608a0.474,0.474,0,0,1,.474.474,0.466,0.466,0,0,1-.178.362A7.51,7.51,0,0,0,79.92,13.414l0,0a0.464,0.464,0,0,1,.216-0.058,0.474,0.474,0,0,1,.474.474A0.462,0.462,0,0,1,80.522,14.1Z" transform="translate(-62)"/></svg>
          </button>
        </div>
<!-- nest -->
  </div>
</section>  <!-- nest -->
<section class="kss-section-inline  kss-c-box  kss-bar-tool__example-switcher">
  <header class="kss-section-inline__header  kss-c-box">
    <h2 class="kss-section-inline__label  kss-c-text">THEME</h2>
  </header>
  <div class="kss-section-inline__container  kss-c-box">
    <!-- nest -->
        <div class="kss-navi-button  kss-c-box  ">
          <button class="kss-navi-button__button  kss-c-button  is-kss-current" type="button" data-kss-example-value="light">
            <span class="kss-c-button__label  kss-c-text">
              Switch canvas to light mode
            </span>
          </button>
          <button class="kss-navi-button__button  kss-c-button" type="button" data-kss-example-value="dark">
            <span class="kss-c-button__label  kss-c-text">
              Switch canvas to dark mode
            </span>
          </button>
          <button class="kss-navi-button__button  kss-c-button" type="button" data-kss-example-value="light-transparent">
            <span class="kss-c-button__label  kss-c-text">
              Switch canvas to light mode (transparent)
            </span>
          </button>
          <button class="kss-navi-button__button  kss-c-button" type="button" data-kss-example-value="dark-transparent">
            <span class="kss-c-button__label  kss-c-text">
              Switch canvas to dark mode (transparent)
            </span>
          </button>
          <button class="kss-navi-button__button  kss-c-button" type="button" data-kss-example-value="expand">
            <span class="kss-c-icon  kss-c-icon--type-expand">
              Expand canvas
            </span>
          </button>
        </div>
<!-- nest -->
  </div>
</section>  <!-- nest -->
</nav>