Emojis as Icons

There are lots of unicode symbols that make pretty good icons already, like arrows (←), marks (✘), and objects (✂︎).You can already colorize these like a normal font glyph. Then, there are emojis, those full-color suckers we all know about. What if you could take just the shape of an emoji and use it like a normal glyph? You can!

Preethi Sam shows how:

.icon {
  color: transparent;
  text-shadow: 0 0 #ec2930;
}

Plus, an alternate technique using background-clip. Note that emojis render differently across platforms, so careful!

Direct Link to ArticlePermalink

The post Emojis as Icons appeared first on CSS-Tricks.


Source: CSS-tricks.com

0 0 vote
Article Rating
Chris Coyier

Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x