OTTR Course Style
Customizing Colors & Style

Download cheatsheet

Last updated: September 11, 2026

How Course Colors Are Controlled

Two CSS files separate OTTR’s defaults from your course customizations:

style_config_default.css

Gets synced from OTTR

• Defines all default CSS variables
• Ensures new variables exist before style.css references them
• Do not edit it; sync updates can overwrite your changes

style_config_custom.css

Not synced

• Overrides the defaults
• Store your course color choices here
• Changes are safe from future sync updates

Customize Course Colors

Edit assets/style_config_custom.css to override only the variables you want to change:

:root {
  --link-color: #a1005a;
  --accent-color: #6e0040;
  --highlight-color: #e754a6;
  --caption-color: #4a4a4a;
  --background-color: #ffffff;
  --callout-background-color: #f6e9f1;
}

• Open assets/style_config_custom.css in your repository.
• Change only the variables you need.
• Commit the change on a new branch and check the pull request preview.

Variables not set in style_config_custom.css continue to use the defaults in style_config_default.css.

Default colors

Changed colors

Use a Course Style Set

Style sets are an alternative to changing CSS variables. If you use a style set, changes to style_config_default.css will not affect that style set.

1. Choose a set from the template’s style-sets/ directory, such as itcr or data-trail.
2. Copy the files for your course type as instructed in that style-set directory.
3. Copy all files from style-sets/<set-name>/copy-to-assets into the top-level assets/ folder of your repository.
4. Open a pull request and check the rendered preview before merging.

Helpful Color Tools

1. Venngage Color Accessibility Tool
2. ColorBuddy

Authors: Padmashri Saravanan from BioData Sage created the cheatsheet content. Katherine Cox structured OTTR’s color customizations. Carrie Wright reviewed the material. Kate Isaac created the original styling, Carrie Wright did the CSS styling, and Carrie Wright and Candace Savonen did the publishing engineering for the cheatsheet. OTTR was created and or is maintained by the following team: Candace Savonen, Carrie Wright, Kate Isaac, Ava Hoffman, Adam Coffman, Katherine Cox, Federick Tan, John Muschelli, Howard Baek, and Jeffrey Leek.