app/assets/css/theme.scss

.theme-primary {
  background-color: rgb(var(--v-theme-primary)) !important;
  color: rgb(var(--v-theme-on-primary)) !important;
}

.theme-secondary {
  background-color: rgb(var(--v-theme-secondary)) !important;
  color: rgb(var(--v-theme-on-secondary)) !important;
}

.theme-neutral-strong {
  background-color: rgb(var(--v-theme-neutral-strong)) !important;
  color: rgb(var(--v-theme-on-neutral-strong)) !important;
}

.theme-neutral {
  background-color: rgb(var(--v-theme-neutral)) !important;
  color: rgb(var(--v-theme-on-neutral)) !important;

  a {
    color: rgb(var(--v-theme-on-neutral--clickable)) !important;
  }
}

.theme-neutral-soft {
  background-color: rgb(var(--v-theme-neutral-soft)) !important;
  color: rgb(var(--v-theme-on-neutral-soft)) !important;
}

.theme-danger {
  background-color: rgb(var(--v-theme-danger)) !important;
  color: rgb(var(--v-theme-on-danger)) !important;
}

.theme-success {
  background-color: rgb(var(--v-theme-success)) !important;
  color: rgb(var(--v-theme-on-success)) !important;
}

.theme-warning {
  background-color: rgb(var(--v-theme-warning)) !important;
  color: rgb(var(--v-theme-on-warning)) !important;
}

.theme-info {
  background-color: rgb(var(--v-theme-info)) !important;
  color: rgb(var(--v-theme-on-info)) !important;
}

.theme-x-create-btn {
  background-color: rgb(var(--v-theme-x-create-btn)) !important;
  color: rgb(var(--v-theme-on-x-create-btn)) !important;
}

.theme-artist {
  background-color: rgb(var(--v-theme-artist)) !important;
  color: rgb(var(--v-theme-on-surface)) !important;
}

.theme-school {
  background-color: rgb(var(--v-theme-school)) !important;
  color: rgb(var(--v-theme-on-primary)) !important;
}