Currently you have to enter theme colours in hex, which isn’t the most intuitive (you also can’t use the normal three digit shortcuts, e.g. #369 == #336699, though # isn’t required).
It would be nice if there were an integrated colour wheel or the like for this purpose.
Another possibility is to pick from the HTML colour names, type them in, or cycle through, as you can typically do with the developer tools CSS input boxes.
Also it’d be nice if up and down keys changed the tone lighter or darker respectively, rather than going to the start and end of the text box. This could require tracking the current colour as floating point HSL in the backend, as you want a smooth increase/decrease of lightness (or maybe luma) with a consistent-as-possible hue and saturation.
I could see some people wanting hue or saturation to be modifiable in this way as well, and perhaps modifier keys could be used to accommodate all of them.
Overall, though, it’s a cool feature, and I appreciate there was a lot of work put in that isn’t obvious to allow colour theme setting, get them all consistent and enable import/export.
P.S.: Be sure to save your theme before you refresh the page if you get hung up of one of the sticky character/room focus issues while editing. The previewed settings will not persist.
1 Like
This is also what I was curious about. Shouldn’t be too hard to change the input type from text to color. The browser will then render a colour wheel when clicking on the field.
Currently I use a userscript as a workaround to edit the input type.
1 Like
If you want to test colors before actually using them as a theme, you can always include them in your URI’s query string:
https://wolfery.com/?theme.color.contrast=%23ffffff&theme.color.muted=%23c9cacf&theme.color.accent=%23e5d08e&theme.color.base=%230f111a
Then once you’re happy with it, you can save it as your theme.
1 Like
That’s cool! The issue above is more about picking and tweaking those hex values in an intuitive way, as in an image editor (though if they’re in the URL, it does avoid the “refresh while preview” issue).
The suggestion to change the type of the input looks interesting; hopefully it can take the currently selected colour as a starting point, as it seemed to reset to black each time on Android when trying to re-pick a custom colour. (On desktop it might show/do something different, of course.)
I see the values are set as a style at the top level <body> so they could possibly be picked in F12 developer tools as well, however I don’t know if this would have the same inheritance effects (it’s great that you can get a lot of the way with a theme by just changing a few base colours).