Skip to content

README.md

Latest commit

 

History

History
48 lines (38 loc) · 2.22 KB

README.md

File metadata and controls

48 lines (38 loc) · 2.22 KB

Language: English | Español

🏎️ Pegasso High Luxury Car Web

This project was developed as part of my first year Web Application Development Degree (DAW) studies. All the interface design, layout structure, and visual composition were created by me from scratch.

Pegasso Web Desktop Preview Pegasso Web Mobile Preview

$\color{green}{\text{Lighthouse Report}}$ Lighthouse Report Pegasso Web

Live Demo

💎 Technical Breakdown (What I applied)

  • CSS-Based Menu: I designed a functional menu using CSS checkbox logic as a core. While the foundation is pure CSS, I integrated a small amount of JavaScript to handle menu closing more smoothly.
  • Layout & Layering: I practiced using z-index layers and CSS masks (mask-image) to create gradient effects directly on images without needing external editing.
  • 3D Interactions: I implemented Z-axis transforms on the product cards to understand perspectives and pseudo-elements (::before, ::after).
  • Fluidity: Focused on transitions using transform and scale for GPU-accelerated performance.
  • HTML5 & CSS3: Clean, semantic markup using Flexbox and CSS Grid.

⚠️ Credits & Disclaimer

Most of the photographic assets and AI prompts used in this project are based on the Czinger 21C hypercar.

Developed by valerodev | 2026