Recently, I worked on implementing a dark theme in a web app. I used a bunch of new-ish CSS things (variables, masks, filters) to put it all together, and I was amazed at how quickly it went. I just wrote it up here in case it’s useful to others:https://medium.com/@mwichary/dark-theme-in-a-day-3518dde2955a …
-
Show this thread
-
Replying to @mwichary
Your text-color-light is a legibility disaster http://contrast-ratio.com/#hsl%28210%2C%2015%25%2C%2035%25%29-on-hsl%28210%2C%2020%25%2C%2012%25%29 …
1 reply 0 retweets 0 likes -
Replying to @kevinmarks
I inherited that colour from an existing theme and didn’t want to reinvent the entire palette as part of this project. I’m curious whether you’ve read as far as high contrast theme and does that change anything?
1 reply 0 retweets 0 likes -
Replying to @mwichary
I did, but as you say it is a bit lacking in nuance. Once you are in HSL you should be able to fix the WCAG compliance more easily.
1 reply 0 retweets 0 likes -
Replying to @kevinmarks @mwichary
that blue-grey text is unreadable in both light and dark versions.
1 reply 0 retweets 0 likes -
Replying to @kevinmarks
Yeah. Thanks for calling me out on this. I could make excuses about lack of time or scope, but to be perfectly honest, it didn’t even occur to me as a dimension I should have been considering.
1 reply 0 retweets 5 likes -
Replying to @mwichary
The current design fashion for ever fainter and thinner type is pervasive - I don't fully understand why so much of the colour gamut is now out of bounds.
1 reply 0 retweets 0 likes
I updated a lot of type there from 300 to 400 or 500, indeed.
Loading seems to be taking a while.
Twitter may be over capacity or experiencing a momentary hiccup. Try again or visit Twitter Status for more information.