A creative and space-themed web project that displays detailed information about the eight planets of our Solar System using pure HTML and CSS. This dashboard presents the planetary data in a visually stunning, sci-fi style interface inspired by space UIs.
✨ Space-Theme Design
- Starfield animated background (CSS only)
- Neon glow UI with transparent glass effect
- Futuristic font styles (
Orbitron,Share Tech Mono)
📊 Planetary Data Displayed
Each planet includes:
- Diameter
- Distance from the Sun
- Number of Moons
- Surface Gravity
- Day Length
- Average Temperature
- Atmospheric Composition
🖥️ Responsive & Interactive
- Stylish table with hover effects
- Responsive layout for desktop & large tablets
- HTML5 – For structuring content
- CSS3 – For styling, animations, fonts, and layout
- Google Fonts – Orbitron and Share Tech Mono
- Background Image – Space stars texture used as animated background
| File | Purpose |
|---|---|
index.html |
Main HTML file with planetary table |
style.css |
CSS styling and starfield animation |
README.md |
Project overview and documentation |
- Download the project folder
- Make sure both
index.htmlandstyle.cssare in the same directory. - Open
index.htmlin any modern web browser (Chrome, Firefox, Edge, etc.). - Explore the planets in style! 🌍🪐
This project was created as part of a course activity to:
- Practice semantic HTML5
- Use CSS styling techniques
- Learn to organize and present structured data
- Create visually engaging web interfaces
- Starfield background texture by Julian Laval
- Font: Orbitron by The League of Moveable Type
- Font: Share Tech Mono
Made with 💙 for space and design enthusiasts.