DEV Community

Cover image for How do you list social media links on a website without using icons?
Kelvin Wangonya
Kelvin Wangonya

Posted on

How do you list social media links on a website without using icons?

I know the easiest way to list social media links is to use icons representing the respective platforms, but have you tried doing it without icons or seen it in the wild? Something more than just a plain list like :

I'm looking for styling inspiration.

Top comments (8)

Collapse
Β 
nataliedeweerd profile image
𝐍𝐚𝐭𝐚π₯𝐒𝐞 𝐝𝐞 π–πžπžπ«π β€’

Not specifically social media links, but here are some nice text link hover animations on tympanus: tympanus.net/Development/CreativeL...

Collapse
Β 
wangonya profile image
Kelvin Wangonya β€’

Awesome resource. The link effects are really nice. I'll definitely be using some of these in my projects. Thanks.

Collapse
Β 
wangonya profile image
Kelvin Wangonya β€’

Interesting πŸ˜„ I'm thinking something like:

🐦 - twitter
πŸ‘¨πŸ½β€πŸ’» - github
πŸ’Ό - linkedin

...right? πŸ˜… Of course having the names show on hover or something...
It would be a bit harder for some users to get it but it's a really fun idea.

Collapse
Β 
lelamanolio profile image
Lela β€’ β€’ Edited

I immediately thought of CSS Tricks footer social links!
I hope it helps 😊

Collapse
Β 
wangonya profile image
Kelvin Wangonya β€’

Yeah! I'd never noticed it. Looks awesome. Thanks πŸ˜€

Collapse
Β 
sym profile image
Ryan Carter β€’

I've seen things like [tw] @username as a low level kind of icon

Collapse
Β 
iceorfiresite profile image
Ice or Fire β€’

Why not use icons for social media links? The user recognizes the icons for FB/Twitter/IG/etc. and knows exactly what to expect so it seems like a best practice to me.

Collapse
Β 
wangonya profile image
Kelvin Wangonya β€’

I agree that using icons is the best way. I just want to see other ways people have done it.