In succession to Split emoji text effect with CSS (which has received an update by now BTW), PixelAmbacht has created a nice Emoji composition using the U+1F60E Smiling Face With Sunglasses emoji (😎) as the key modifier.
Note: For some mysterious reason the original demo yielded a blank page for me. Changing the font-size to anything lower than the originally set 8em fixed this issue. Therefore I’ve embedding a fork of the original demo.
Here’s how it works: The 😎 emoji is injected using generated content. It is positioned on top of the original emoji, and cut off (in height) so that only the sunglasses remain. In the end mix-blend-mode: darken; is added to make ‘m a bit transparent. Only works with the default Mac Emoji BTW.
Personally I’ve gone with overlaying the 🕶 emoji, to not have to use any blending at all.
Sidenote: Marcin Wichary has also been busy mocking up some emoji variations, and compositions using the ❤️ emoji:
Workshopped a bunch of emoji ligatures for more complex and underrepresented feelings.
Leave a comment