Website navbar components different colour on published site

Hi all,

Having issues with my published portfolio site. The logo and menu button are supposed to be white but when published are appearing orange - as if there as in vert filter on them. Unsure on what the isssue is and any help would be appreciated. Any questions please ask!

Check your site’s custom CSS, you have a mix-blend-mode: difference on your .navbar-flex-wrap class making the navbar logo and menu button appear orange.


Hi, thanks for your reply, I can’t seem to see where ‘mix-blend-mode: difference’ is in the custom CSS?

You can find it in your page settings or site settings code, or in an embed element somewhere. But it should be in your page settings/site settings custom code.

Take a look at the doc below for reference on how to access it.

Thank you, I found it in the page settings! I also seem to be having an issue with page titles appearing the wrong colour when published, I tried looking at page settings etc but couldnt see anything :/

1 Like

You have a CSS script as shown below in the screenshot affecting your title text class. Same thing, check site settings custom code or any embeds you may have.

Appreciate all your help, I can see this is the CSS preview, but I can’t see how to remove this? I have checked site settings, page settings and any embeds I have on the site

The settings are on your 1440px breakpoint. You should reset the color so it inherits from your base breakpoint and stays as white for all breakpoints.

I recommend downloading Finsweet Extension to help you remove the breakpoints instead as having more breakpoints will confuse you currently. Your build is also quite unoptimized in a lot of ways, it may be better to start with referencing community built projects to learn how to build consistent and scalable structure then improvise from there. Finsweet Client-First framework is a good starting point.

1 Like