Is it possible to set colors of text and background based on a site's theme css?

I have a typical SharePoint Online form published using Plumsail. When I change the site's theme and refresh the browser a few times, the form starts using fills and text to match the site's theme colors. That's great. Now I get a request to make the header background to be a darker shade. Because people like changing theme colors or copy forms to other sites, hard coded colors can clash.

Rather than adding css to specify a color code, I would like call the built in SharePoint CSS color options found here. sp-css-backgroundColor-* - List Formatting Samples ( To be specific, I would like to use the "[theme: sp-css-backgroundColor-themeDarker]" option. I'm not strong in CSS but I managed to get it to change color when specifying a Hex code. Hopefully it's possible and I'm just missing something.

.my-class {
    font-weight: bold;
    background: #739abc;    

Hello @pbehler,

The sp-css-backgroundColor-* classes are available only if the page contains list formatters, so these classes are not available on the form page. We can add JS-api for loading those styles on demand, but this will be paid support.

Another way is to set the background of the header right in the designer:

Thanks for getting back to me. At least I know I can stop spinning my wheels trying to figure out if I'm doing something wrong. I was really hoping to take advantage of the site theme palette and default SP color options.

I'm not familiar with "paid support" option.


Paid support is payment for adding functionality you want/need to see in our products.