We do our best to make your themes visually appealing with the colors submitted on your installation for but maybe your institution has updated their color scheme or administration doesn't like the the order of the colors in the theme and you need to change them.


The colors are set in the institutional CSS file that is uploaded to Canvas. There are several variables that look like this:

/* Theme Colors */
:root {
--dt-color-primary: #820024;
--dt-color-primary-contrast: #FFFFFF;
--dt-color-primary-dark-text: #820024;
--dt-color-secondary: #949CA1;
--dt-color-secondary-contrast: #000000;
--dt-color-secondary-dark-text: #404345;
--dt-color-accent: #4C5360;
--dt-color-accent-contrast: #FFFFFF;
--dt-color-graybg: #E6E6E6;
--dt-color-graybg-contrast: #000000;
}

Each variable is tied to the themes. --dt-color-primary is the main color used throughout all of the themes with --dt-color-secondary also being used through most of the themes. The other colors provide accents to certain themes or set appropriate contrast colors. Replacing the color in that list and uploading the new CSS file will change that color throughout all of the themes.

You can also use the "Theme Colors" page in the customizations course to test your colors. Paste those variables in the CSS editor that pops up on that page and you can change the color and select the different themes to preview what that would look like. This is something that will only be visible to you, the user, on that page. When you find the color you would like, you can copy the variables and move them to your global CSS stylesheet in Canvas where it will make the change for everyone.

Since this will be set at the institutional level, the sub-accounts will also be impacted.

You may also want to update the "Color Palette" page in your institutional and sub-account customizations courses.