favicon does not adapt well to light / dark theme change

[MikeMcC399]

Description

The favicon.svg is supposed to adapt its color depending on the background. That does not work very well in Google Chrome and in some cases the cy letters are not readable.

URL of Issue(s)

https://docs.cypress.io/

Steps to replicate

Settings > You and Google > Customize your Chrome profile > Pick a theme color
Settings > Appearance > Theme > Open Chrome Web Store

Browser

First reported on Google Chrome 116
Still reproducible with Google Chrome 140

Device

• PC
• Mac
• iPhone
• iPad
• Android Phone
• Android Tablet

Additional Information

Black

Warm grey

[MikeMcC399]

The themes in the Chrome Web Store seem to have changed since this issue was first reported, however the issue is still reproducible with Google Chrome 128.

Chrome Settings > Appearance > Reset to default

Selecting the Black & White theme illustrates the issue best
Open https://docs.cypress.io/
Right click open tab and select Duplicate, now shows both light and dark tabs, where the logo is hardly readable on the dark tab.

[jennifer-shehane]

Open to PR here, might require some figma skills or similar though. Our logo pack is on our website: https://www.cypress.io/press-kit#logos

[MikeMcC399]

@jennifer-shehane

Open to PR here, might require some figma skills or similar though. Our logo pack is on our website: https://www.cypress.io/press-kit#logos

I don't have the skills to fix the Cypress logo, and the issue remains that the Cypress logo is not well readable in browser tabs / toolbars for Chrome and Firefox. The Microsoft Edge browser seems to do a better job and makes the logo readable.