This was brought up in another thread. This and other some other emojis do not translate well to dark backgrounds, such as night theme on this site. I’m not necessarily looking for a specific solution for dev.to, but I’d be curious to hear about possible approaches to this sort of thing.
For further actions, you may consider blocking this person and/or reporting abuse
Latest comments (26)
Put some kind of bright border around it? And do this consistency for all dark emojis, so that people get used to seeing it and it isn't jarring.
Here's a very rough concept, but it could be polished to look aesthetically pleasing:
make emojis consistent across all platforms and use github.com/twitter/twemoji
Just goes to show how different an emoji may look on different systems - for me, that was Windows 10 with Firefox.
preethisam.com/2018/06/25/how-to-u...
This allows you to color emojis to your heart's content!
Just don't support darkmode.
You must work for Slack 😆
Sorry that was a low blow, I still love Slack heh.
But this post has made me realize, maybe the reason slack hasn't released darkmode is because it's hard to get it right.
ಠ_ಠ
That train left the station already 😂
Go to compart.com/en/unicode/search?q=ch... it is a list of unicode checkmarks(emoji is there too).
Once there, run this in the console to make all of them red or whatever color you like to see which change.
document.querySelectorAll('.char').forEach(element => element.style.color = 'red');Edit: After that of course, pick one and switch it.
Clean solution: like Slack, they use their own emojis (and convert any font emojis into theirs).
Simple dirty hack: download the font that has the not good looking "✔️" and make the necessary changes and there you have your own font.
Maybe a CSS paintlet to add a white outline or drop shadow around the glyph. Not sure if that's even possible.
Unless you end up wrapping every emoji character in something:
I don't think it's possible to select just emoji characters with CSS.
I haven't gotten my hands wet with CSS Paint API yet, but it looks like the painter's
paintmethod doesn't get access to char data., so yeah you'd have to use some server code to wrap the desired emoji.That’s probably pretty feasible. We do a bunch of similar things in the markdown compiler, and it wouldn’t interrupt compatibility.
We’d want some awareness of which emojis are and aren’t visible in dark mode. We would only want to give those that treatment. Most play well with any background.
This. Switch out & make accessible(?) + add basic sentiment analysis for dev.to (ability to see happy vs sad moods overall on boards). Regardless, a sitewide unscientific emoji stream page where you can just see emojis (+post) that ppl recently used would be interesting here as there is a lot of 'dev mood' talk.
twemoji.twitter.com - emojis will be consistent, scalable, animatable, customizable.
emojipedia.org - emoji OS inconsistencies.
sarasoueidan.com/blog/icon-fonts-t... batch existing.
i❤.ws just for fun.
There is not much out there on SVG vs emoji but SVG is clearly better. Maybe I'll try it & see how it goes.
Coloured fonts, and emoji, are fundamentally broken in this regards and there is no solution to the problem. So I doubt it'll just be ✔️ that causes the problem.
I'm in favour of having fonts that provide only B&W glyphs, for use in places where the color is important.
But isn't ✔️ changing color in dark mode?
I discovered a lot of problems when doing mobile development, where I thin it was iPhone, wasn't even applying the opacity to coloured glyphs. Being able to apply colored tinting would be nice. It looks like most apps ignore the issues, since they don't have a way to solve it.
Not too technical, but if wanting to just use emojis. I use ✅ in dark themes.
Occam's Razor. "The simplest solution is almost always the best.”
This is actually good.