Project Overview NeonFlux is a cutting-edge web template designed to capture the “Future of Web Design” aesthetic. Built entirely without external frameworks, this project demonstrates the power of modern CSS3 and vanilla JavaScript to create immersive, high-performance digital experiences. The design merges the gritty, high-contrast look of Cyberpunk with the clean, frosted-glass elegance of Glassmorphism.

Key Features

• Immersive 3D Hero Section: Features a pure CSS animated 3D grid floor that moves endlessly in perspective, creating depth and motion without heavy WebGL libraries.

• Glassmorphism UI: Navigation bars and cards utilize backdrop-filter: blur() and semi-transparent backgrounds to create a frosted glass effect that sits beautifully over the dark theme.

• Responsive Architecture: A mobile-first approach ensuring the layout adapts seamlessly from desktop 4K monitors to mobile devices, including a custom hamburger menu.

• Dynamic Interactions: Includes hover states, glowing neon borders, and smooth page transitions to enhance user engagement.

• Functional Layouts:

  • Home: Hero section, feature grid, live statistics, and pricing tables.

  • About: Split-screen layout with object-fit image handling.

  • Blog: CSS Grid layout with auto-cropping image cards.

  • Contact: Form styling and an embedded, interactive Google Map filter-styled to match the dark theme.

Technical Stack

• Structure: Semantic HTML5

• Styling: Modern CSS3 (Variables, Flexbox, CSS Grid, Keyframe Animations)

• Logic: Vanilla JavaScript (ES6+ for mobile toggles and active state highlighting)

• Performance: 100/100 Lighthouse score potential (Zero bloatware/dependencies).