Making the icon/wordmark more aware of value for dark themes

[bollwyvl]

References

• from Usage guidelines for Pyodide logo pyodide#3634

Pitch

Change (or add versions of) the wordmark and logo to preserve the branding on different backgrounds.

Pitch

The main brand in the wordmark and icon disappear on a dark background: when used in other composite documents, it's required to either always put a light background behind the mark to keep the branding.

Design Ideas

Adding a "dark" variant (inverting white and black) might be the simplest approach.

Adding a white background (with a known width, e.g. the width of the WASM notch), a two-tone treatment might just crop to the "PY" and the WASM logo, which is still distinctive at 16x16:

favicon (16x16)	icon (64x64)

Or, reusing the "PY" on the WASM box:

favicon (16x16)	icon (64x64)

💭 i personally find this variant a little easier to identify in the smaller size, and less disruptive against a dark background... though i'd probably make "PY" a bit. I guess it would fall down on a lavender document...

This could be extended to the wordmark, with "ODIDE" coming off the right side of the WASM block, which would tighten up where the wordmark is use typepgraphically.

It may also be useful to have a single-color logo which can be integrated in other places.

Future Work

As a follow-on (or considered as part of defining the needs of the icon), it may also be helpful to think about a "powered by pyodide" or "works with pyodide" badge, suitable for putting on README.md files, etc.

[phorward]

Hello @bollwyvl,
thank you very much for creating this issue and pointing out the problems.
I'm totally with you, the Pyodide-Logo should be easy to integrate in various places.

As I'm not a designer, I cannot provide any useful input on this, except that I like a logo and the idea behind it.
I think, the best would be if you provide a pull request on new logos or logo/icon replacements, so we can discuss about it in the specific case.

What do the others think?

[ryanking13]

Thanks for the proposal! I also generally agree with the problems.
Personally, I like the idea of adding a white background... but not a strong opinion.

@rth

[rth]

Thanks for the suggestions and ideas @bollwyvl ! We would definitely need a logo variant that works for a dark background and flavicons.

We have a designer who currently works on a new Pyodide home page (and who created the initial logo). She will also do the logo style guide as you suggested. Once there is a first iteration, the proposal will be shared on GH.