Create a neon button with a reflection using CSS
A look at creating a neon button effect using CSS, including a glowing reflection on the "ground", and a little dive into the world of performance as well.
Performance link I mentioned in the video: / how-to-achieve-60-fps-animations-with-css3
The code: https://codepen.io/kevinpowell/pen/QW...
⌚ Timestamps
00:00 - Introduction
00:50 - What we're starting with
01:20 - Styling the button
03:54 - Adding the glow to the text
06:20 - Adding the glow to the button
07:39 - Adding the reflection
13:42 - Adding the hover/focus styles
#css
--
Come hang out with other dev's in my Discord Community
💬 / discord
---
Keep up to date with everything I'm up to
✉ https://www.kevinpowell.co/newsletter
---
Help support my channel
👨🎓 Get a course: https://www.kevinpowell.co/courses
👕 Buy a shirt: https://teespring.com/stores/making-t...
💖 Support me on Patreon: / kevinpowell
---
My editor: VS Code - https://code.visualstudio.com/
---
I'm on some other places on the internet too!
If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.
Instagram: / kevinpowell.co
Twitter: / kevinjpowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powell
---
And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!
Watch video Create a neon button with a reflection using CSS online without registration, duration hours minute second in high quality. This video was added by user Kevin Powell 30 April 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 535,58 once and liked it 27 thousand people.