I'd really like to see orange part of the Stack Overflow logo when in dark mode.
I noticed that the Stack Overflow image is just plain white on dark-mode
vs the light-mode view:
So I inspected the CSS and found:
@media (prefers-color-scheme: dark)
body.theme-system .s-topbar .s-topbar--logo .-img {
filter: invert(.5) brightness(2);
}
So I figure with tweaks to the filter
property we could still keep the orange of the logo...
@media (prefers-color-scheme: dark)
body.theme-system .s-topbar .s-topbar--logo .-img {
filter: invert(1) hue-rotate(170deg) brightness(1.51);
}
I did some further inspection and found that (according to Chrome's eyedropper tool) the standard icon's orange is: #f27f30
and the above CSS produces the orange part to be #ff7f2d
.
So I realise, it's a little out on the blue value, but would it be possible to implement this so dark-mode users can see a little color in the logo?