How to change the header color of the backoffice in Umbraco v16?

Hello, I’m new to Umbraco and I’m using version 16. I’d like to know how I can change the color of the header in my backoffice. I saw some tutorials about creating a package.manifest and linking it to a .css file, but I wasn’t successful. Is there an easy way to make this change?

Hi @felipemadu13

Its a bit unclear where you got stuck, but my suggestion would be to make an Backoffice Entry Point Extension(Backoffice Entry Point | Umbraco CMS)

With code like this:

export function onInit(host: UmbElement) {
    const link = document.createElement('link');
    link.rel = 'stylesheet';
    link.href = '/css/global.styles.css';
    host.shadowRoot?.appendChild(link);
}

pointing to a css file that overwrites the CSS Custom Properties that you like to change.

I hope that gives you enough to find your way? If not I think we need to know a bit more about what you have success with and what fails for you.

1 Like