DEV Community

loading...
Cover image for Amazing Tab Bar (Animated)

Amazing Tab Bar (Animated)

vacom profile image Vitor Amaral ・1 min read

Animated Mobile Tab Bar

This CodePen was created by @amaralflavio (aka my little brother), it shows a cool tab bar animation that can be used for a mobile navigation. The code and demo https://codepen.io/flavio_amaral/full/xxgYGrR

Sharing here to give him some love.

Credits: - Design based: https://dribbble.com/shots/10474707-Experimental-UI-animation - Icons: https://icons.getbootstrap.com - Colors: https://material.io/resources/color - Font: https://fonts.google.com/ - Image: https://www.pexels.com/ - Jello Animation: https://animista.net/play/basic

Discussion (3)

pic
Editor guide
Collapse
inhuofficial profile image
InHuOfficial

Looks great!

Give your brother a little push to consider disabled users though, it is unusable with a keyboard due to lack of focus indicators and the fact you can still tab to "new, popular and following" even when they are not visible.

However he is (or will be, not sure how old he is!) a great designer with UI elements like that ❤

Collapse
vacom profile image
Vitor Amaral Author

Hey Thank you for the feedback.

Some comments have been hidden by the post's author - find out more