🔥 Create a Portfolio Website Using HTML & CSS & JavaScript | Light & Dark Theme

Learn how to create a responsive portfolio website from scratch. ⭐️ Zyro : https://zyro.com/special/truecoder Discount code : TRUECODER -- Web Design Tutorial -- Today, we got a special tutorial, we're going to learn how to create a complete personal portfolio website from scratch, we're going to be using HTML, and modern CSS techniques such as CSS grid, flexbox, pseudo selectors, keyframes and more. We're also going to use JavaScript to add some some stunning animations to the website and make it interactive. The website will have a ton of features : the filter animation, testimonials slider, sticky navbar animation, modals .... Not only that, our website will have both dark and light themes, that we can switch between theme using a toggle button in the navbar. And finally by the end of this video, we're going to see how we can make this website completely responsive on any device, so it stays responsive no matter what the size of the device is. 💚 Get template https://buymeacoffee.com/true_coder/e... 💚 Get template by Paypal https://ko-fi.com/s/7919d49761 👍 Now if you find this video valuable, please make sure to leave a like, and subscribe to the channel, this is the best way you can support me to make more videos like this. 🛎 Also, click on the bell icon to turn on notifications. This way you'll be notified the moment new videos are uploaded. 💖 Please feel free to support my channel. Your donation will motivate me and push me to keep making more of these tutorials. Paypal : https://paypal.me/truecoder Buy me a coffee : https://www.buymeacoffee.com/true_coder 📁 Assets Icons: https://iconscout.com/unicons Fonts: https://fonts.google.com/ Mixitup: https://www.kunkalabs.com/mixitup/ ScrollReveal: https://scrollrevealjs.org/ Swiper: https://swiperjs.com/ GitHub: https://github.com/sefyudem 💻 Start project from scratch (Images and files used in this tutorial) https://bit.ly/37fzGhQ 🚫 DON'T CLICK THIS : https://bit.ly/2SuCfW3 ✉️ For Business inquiries : [email protected] ⏱ Timestamps: 0:00 - Intro 05:56 - Zyro 7:11 - Project Setup 7:36 - Navbar 21:43 - Showcase area 33:55 - ScrollReveal Animation 35:36 - About section 45:22 - Skills Section 1:04:20 - Services section 1:15:28 - Portfolio section 1:30:16 - Modal & Image Slider 1:42:10 - Testimonials section 1:55:50 - Contact section 2:06:02 - Newsletter section 2:10:06 - Footer section 2:13:22 - Active Navbar Links 2:20:20 - Light/Dark Theme 2:32:18 - Making the website responsive