# 02 - Color Theme

🎨 Apply dark mode to the entire chart.





    <ul class="theme-swatches" v-for="(swatch, index) in palette" :key="index">
        <li class="theme-swatches-item" v-for="theme in swatch" :key="theme.name" @click="switchTheme(theme.name)">
          <label class="theme-swatches-label" :for="theme.name">
            <input class="theme-swatches-checkbox" type="checkbox" :id="theme.name" />
            <span class="theme-swatches-name">{{ theme.name }}</span>
          </label>
        </li>
      </ul>
    
     <vuetiful-board
        :theme="theme"
        :dark-mode="darkMode"
        :col-num="colNum"
        :row-height="rowHeight"
        :layout-editable="layoutEditable"
        :datasets="[]"
      />
    
    switchTheme(themeName) {
      this.theme = themeName;
    },