diataxis-documentation-framework icon indicating copy to clipboard operation
diataxis-documentation-framework copied to clipboard

Dark logo and dark-mode-ready content

Open webknjaz opened this issue 3 years ago • 1 comments

Hey @evildmp, the current dark mode logo is white and has high contrast with the rest of the website and https://pradyunsg.me/furo/customisation/logo/#different-logos-for-light-and-dark-mode is a thing. Also, it should ideally be SVG in which case, maybe, it won't be necessary to have two logo files and just make use of CSS media queries inside SVG.

Same goes for the rest of the imagery. While PNG supports transparent background, it'd be nice to have those images scalable too.

Note that if you ever decide to embed one of the images into the GitHub readme, you can also use SVG there as well as separate images with different URL fragments for the schemes.

webknjaz avatar Jan 11 '23 19:01 webknjaz

As a simpler solution, you can also use this command for ImageMagick to convert white to transparency:

convert input.png -transparent -fuzz 10% white output.png

The -fuzz 10% parameter will help with gradients and gradual transitions from white to a colour like orange.

This should work right now for the logo.

Of course, the author will need to select another colour for the diagrams, as they have text in black on them currently.

superuser-does avatar Nov 03 '24 00:11 superuser-does