Responsive Lamp Website Design Using HTML CSS & JavaScript
Responsive lamp website design using HTML CSS & JavaScript. With CSS animations when scrolling. Includes a light and dark theme. And deployment of website to the internet. Developed first with the mobile first methodology, then for desktop.
🔔 Subscribe for more!
https://www.youtube.com/@Bedimcode
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
❤ Get template
https://www.buymeacoffee.com/bedimcode/e/136181
💙 Get template by PayPal
https://ko-fi.com/s/fd8719e586
🔗 All Source Code
https://www.buymeacoffee.com/bedimcode/membership
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
👨💻 Build the project from scratch
https://github.com/bedimcode/responsive-lamp-website
👆 Download (files + images)
– Click on the GitHub link
– Click the green button (code)
– Click Download ZIP
📂Assets
Icons: https://remixicon.com/
Fonts: https://fonts.google.com/
JS Functions: https://github.com/bedimcode/responsive-watches-website
Swiper: https://swiperjs.com/
ScrollReveal: https://scrollrevealjs.org/
Netlify: https://www.netlify.com/
⏱ Timestamps
0:00 Intro Responsive Lamp Website
5:32 Project Setup
7:25 Variables CSS
7:34 Reset HTML & Reusable CSS
10:46 Header & Nav
21:45 Section Home
34:39 Buttons
36:50 Change Background Header
38:52 Section Popular
55:12 Section Choose
1:13:35 Section Features
1:22:06 Section Products
1:29:16 Section Join
1:36:06 Footer
1:46:20 Scroll Bar 1:47:27 Scroll Up
1:50:16 Scroll Sections Active Link
1:52:00 Dark/Light Theme
2:05:40 Breakpoints
2:45:18 ScrollReveal Animation
2:49:12 Final Project
2:50:35 Website Deployment (Uploading to the internet)
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
📸 Original Images
https://unsplash.com/
💬 Doubts in the project send a DM to Facebook
⌚ I answer at 6:00 PM (Perú time)
– – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – – –
🔥 Follow me!
https://www.facebook.com/bedimcode
https://www.instagram.com/bedimcode
☕️ Support me
https://www.buymeacoffee.com/bedimcode
https://ko-fi.com/bedimcode
👍 Thanks for watching!
Make sure to like + Subscribe for more! 💗
#responsivewebsite #websitehtmlcss #bedimcode
Comments are closed.