In this video, I show you how to create a responsive coffee website design using HTML, CSS and JavaScript. Developed first with the Mobile First methodology, then for desktop.
❤ Get template
❤ Get template by PayPal
📁 Assets
Icons:
Fonts:
GitHub:
Mixitup:
✒️ Inspirate
👨💻 Start project from scratch
☝ Download the project base files on GitHub
– Click on the GitHub link
– Click the green Code button
– Download ZIP
– Save and extract where you prefer
🔔 Subscribe for more!
⏱ Timestamps
0:00 Intro Responsive Coffee Website
3:32 Project Setup
5:20 Variables CSS
7:27 Reset HTML & Reusable CSS Classes
10:38 Header & Nav Menu
19:25 Home
27:24 Change Background Header
29:32 Specialty
34:53 Products
53:31 Quality
01:00:50 Logos
01:03:02 Blog
01:10:42 Footer
01:21:14 Scroll Bar
01:22:12 Scroll Up
01:25:44 Scroll Sections Active Link
01:27:22 Breakpoints
01:49:21 Loader
01:51:56 Final Project
☕️ Support me
💙 Support me by PayPal
👍 Thanks for watching!
Make sure to like + Subscribe For More! ❤
Home images
#responsivewebsite #coffeewebsite #bedimcode
Gracias por el video!
Do you guys know where can I get the specialty imgs?
Nice work mate! Where did you find the coffee load gif? Thanks
GREAT VIDEOS! I like how you reuse your code! I always enjoy watching your videos. Can you create a 2 pages website? or the read more / read less buttons. Thanks
Love from India Sir
Hey, why my nav links floating in mobile version?
I know this is not the right way to ask a question like this, There is anyway to find out the price of a website like this one? please
Sir makeup website create
Pro do you have figma accon
the tutorial you provide is very helpful to understand how to code structured,
I want to ask how do you determine the size of the font and padding or margin? is there a standard?
do you have any references i can study?
Thank's
33:16
Scroll link active works just for the first link others no what is wrong
love it bro
The last li in the products__filters product_line didn't show up to you but me it show line
Thank you for making good tutorials.
This makes me more confident.
Thank you..
Thank You so much! you are great!
thank you for the inspiring. can you make movies websites for ui ux
This’s amazing channel 💕i wonder your github profile. Could i learn your github username?
Hello my friend, we want a multilingual website, if you honor you, and all thanks and respect
100K complete Advance Bro🥳🥳
Can we see next html css design for invoices please
hey, vscode extensions – what path? e.g. img src folder… how to..?
I would love the day I hear him explain with his voice
thanks , nice video
Thank you for helping us getting better man
You are crazy dude. You taught me a lot. thank you brother
love u so much 😊
Make videos in the backend ok
Agar mai aap se 10 website ka pack lu to kya rate lagayenge….
👍👍👍👍👍👍 really great 💓💓💓💓 design
This is So amazing, creativity in every line of code. Thank you