CSS Only Lightsaber (with sound?!?!)

From the creator

May the force be with you! The Codepen: https://codepen.io/kevinpowell/pen/jOygveP Playing Sounds with CSS on CSS Tricks: https://css-tricks.com/playing-sounds-with-css/ (I made it sounds like I found this during the video, it was with the help of someone in the live chat on Twitch though, so a big thank you to them, it really put the cherry on the cake!) More info on border-radius: https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius ⌚ Chapters 00:00 - Intro 00:38 - What we are starting with 01:49 - Styling the hilt 06:51 - Styling the blade 16:43 - Turning it on and off 22:42 - Adding the different colors 28:36 - Darksaber shape 30:25 - Adding the sound with CSS #css #maythe4bewithyou -- Come hang out with other dev's in my Discord Community 💬 https://discord.gg/nTYCvrK --- 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-the-internet-awesome 💖 Support me on Patreon: https://www.patreon.com/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: https://www.instagram.com/kevinpowell.co/ Twitter: https://twitter.com/KevinJPowell Codepen: https://co

Published 2021-05-04 · Watch on YouTube ↗
Availability and playback restrictions are controlled by the original channel.