If you just want to color code the top bar in the UI, you could load some custom CSS by putting something like the following in module.config:

<clientResources>
   <add name="customStyling" path="ClientResources/CustomUI.css" resourceType="Style" /><!-- Loads a custom stylesheet for the Optimizely UI -->
</clientResources>

<clientModule initializer="">
   <moduleDependencies>
      <add dependency="CMS" type="RunAfter" />
   </moduleDependencies>
   <requiredResources>
      <add name="customStyling" />
   </requiredResources>
</clientModule>

Your CSS could be something like the following:

/* Change colors of top menu bar */

.epi-pn-navigation.mdc-top-app-bar .epi-pn-navigation-row__primary {
    background-color: orange !important;
}

.epi-pn-navigation .epi-pn-logo-background {
    background-color: darkorange !important;
}

You could perhaps serve your CSS served through a minimal API endpoint, to apply color code based on config/environment.

Note: I copied this from an old demo I presented a long time ago, so you may want to target other CSS identifiers.