Skip to content

RonitkumarSoni/SpaceX-Clone

Repository files navigation

🚀 SpaceX Website Clone

A responsive SpaceX website clone built using HTML, CSS, and minimal JavaScript, focusing on clean UI, smooth layouts, and responsive design across devices.

This project demonstrates my understanding of frontend fundamentals, modern CSS techniques, and real-world website cloning skills.


📸 Preview

SpaceX Clone Preview

Note: Preview image is stored inside the screenshot-preview folder.


🛠️ Tech Stack

  • HTML5 – Semantic and accessible markup
  • CSS3 – Flexbox, Grid, Media Queries
  • JavaScript (Basic) – Countdown timer functionality
  • Responsive Design – Mobile, Tablet & Desktop friendly

✨ Features

  • Pixel-inspired SpaceX UI clone
  • Fully responsive layout
  • Multiple pages:
    • Home
    • Launches
    • Mars
  • Custom media queries for different sections
  • Countdown timer using JavaScript
  • Clean and organized project structure

📁 Folder Structure

SpaceX-clone/ │ ├── assets_spacex/ │ └── (images & assets) │ ├── screenshot-preview/ │ └── asset_0.jpeg │ ├── index.html ├── launches.html ├── mars.html │ ├── style.css ├── media-quary.css ├── launches.css ├── launches_media-query.css ├── mars.css ├── mars_media-quary.css │ ├── README.md ├── LICENSE


📱 Responsiveness

The website is optimized for:

  • 📱 Mobile Devices
  • 💻 Laptops & Desktops
  • 🖥️ Large Screens

Each section uses separate media query files to maintain clean and scalable CSS.


🎯 Learning Outcomes

  • Improved HTML semantic structure
  • Mastery of CSS Flexbox & Grid
  • Practical use of media queries
  • Real-world website cloning experience
  • Better project organization & readability

🚧 Future Improvements

  • Add smooth animations using CSS / JS
  • Improve accessibility (ARIA roles)
  • Convert project into React version
  • Optimize images for performance

📬 Contact

Wednesday
Frontend Developer

If you like this project, feel free to star the repository!

About

A responsive SpaceX website clone built using pure HTML and CSS, focused on recreating the official SpaceX landing page design with high visual accuracy. This project demonstrates my ability to translate real-world designs into clean, structured, and responsive front-end code.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors