将颜色主题应用于div元素。威化

Question

我正在处理Vue项目，并经历并实现了Vuetify主题。将颜色主题应用于vuetify元素可以很好地工作（例如，v-card，v-timeline，v-flex等）。是否可以将颜色主题应用于不属于vuetify生态系统的某些元素？

这是我的主题代码：

Vue.use(Vuetify, {
  iconfont: 'fa',
  theme: {
    primary: '#730710',
    secondary: '#0D0000',
    accent: '#BEBABF',
    error: '#BA1B1A',
    success: '#468966',
    warning: '#FFB03B'
  }
})

我的基本HTML：

<div class="box"></div>

样式（我希望让所有元素一起改变）：

.box {
   width: 100px;
   height: 100px;
   background-color: --my-theme--;
}