🏡 Create a Responsive Real State Website Design Using HTML CSS & JavaScript



How to make a responsive real state website design using HTML CSS and JavaScript. Real estate landing page. Along with css animations and dark light theme. Developed first with the Mobile First methodology, then for desktop.

❤ Get template

💙 Get template by PayPal

📁 Assets
Icons:
Fonts:
GitHub:
Swiper:
ScrollReveal:

👨‍💻 Start project from scratch

☝ Download the project base files on GitHub.
– Click on the GitHub link
– Click the green button (code)
– Click Download ZIP
– Extract the project to the desired location

✒️ Inspiration & Original design

🔔 Subscribe for more!

⏱ Timestamps
0:00 Intro real state website
4:06 Project Setup
6:01 Variables CSS
8:19 Reset HTML & Reusable CSS Classes
11:18 Header & Nav
18:55 Home
31:13 Buttons
33:56 Change Background Header
36:00 Logos
38:12 Popular
52:52 Value
01:13:36 Contact
01:25:47 Subscribe
01:29:27 Footer
01:41:20 Scroll Sections Active Link
01:44:14 Scroll Bar
01:45:40 Scroll Up
01:49:08 Dark/Light Theme
02:00:56 Breakpoints
02:30:30 ScrollReveal Animation
02:36:05 Final Project

📬 Any questions about the project send a DM to Facebook (Bedimcode)
⌚ I answer at 6:00 PM (Perú time)

Images

☕️ Support me

💙 Support me by PayPal

👍 Thanks for watching!
Make sure to like + Subscribe For More! ❤

#realstatewebsite #responsivewebsite #bedimcode

29 comments

  1. Someone kind could tell me why the breakpoints is <350 and < 320 and >576? how about the width between 350 and 576? and is there some github address that I can download code and compare with my local files? I have sth different from video and don't want watch it twice.

  2. could you explain what your prefixes in the bem classes mean? "l-" is for layout, but "bd-" (grids, containers)? Is it for body structure I guess?

  3. .value__container,
    .contact__container{
    grid-template-columns: repeat(2, 1fr);
    align-items: center;
    }

    dude can you healpme this script cant work in me the image cant move

  4. Hi! Your video is very good! Can you make video how to make website in different languages with switcher using javascript (or json)? for example, in spanish and english?

  5. Man, I was impressed with your level, I can't even imagine how long it took to get there. Congratulations! I started studying front end development 6 months ago. I have a question, could you answer me??

Leave a Reply to Rizki Candra Cancel reply

Your email address will not be published.