Open ffigiel opened 8 months ago
All those themes use colours very different from the Gleam colours. We'll need something that has the same feeling as the current themes being used.
Sorry that's not very useful, I don't know much about how visuals work
The first issue that comes to mind with the current syntax highlighting support is the fact that the colours do not adapt based on the applied theme (light / dark mode). Regardless of what colour scheme we end up using, we need it to have both a light and a dark variant.
I like the way the rust book allows its readers to change colour schemes on the fly. Maybe we could offer something similar, with a couple options that fit the current theme's vibe while offering some level of customisation.
Upon searching for some themes, I happened to find VsCode Themes, a place to compare some popular colour schemes
šļø The current syntax highlighting theme in the code editor makes the text difficult to read on dark mode. I wanted to improve it, but we didn't have a candidate for the new theme.
Today I felt bored/curious, and things happened. I wrote a lil python script to collect colors from the biggest standardized colorscheme resource I know and draw some candidates. The script just takes as weighted list of colors and scores how close the colors in the theme are to the input colors. (also, it converts the colors HSLuv before scoring to keep results relevant to humans)
šļø I ran this with various weights/colors from our branding and here are my notes for the top results:
base16-material-palenight happens to exactly use the "Underwater Blue" color as the background, so it's pretty much a drop-in replacement for the current dark code theme. Also, it could be adapted to use the Faff Pink and Unnamed Blue colors as it has very similar colors there.
If we perhaps wanted to redesign the page a little bit and use a floating box for the code, like on the website instead of plain divider lines, base16-chalk is using the same Blacker color. It also features
#f5f5f5
as the light mode background, which is the same background color for code on the docs sitesbase16-railscats has the most compatible grays
base16-snazzy and base16-rebecca often appeared in the top results
(honorable mention), base16-mellow-purple was the closest to Faff Pink š
š Let me know if it's any useful and what the next steps would be. I'm happy to share the script too but I doubt you'd find it as interesting as I did š