⚡ NEXUS

Cyberpunk Animated Landing Page

🌌 A futuristic landing page inspired by cyberpunk aesthetics, interactive motion, and modern frontend animation.

---

🌍 Overview

NEXUS is a modern cyberpunk-inspired landing page built entirely with HTML, CSS, and Vanilla JavaScript.

The project combines immersive animations, glowing UI elements, interactive particle effects, and responsive design into a single lightweight page with no frameworks or external dependencies.

---

✨ Features

Feature	Description
🌌 Particle Network	Animated particles connected with dynamic lines
⚡ Glitch Effects	Cyberpunk-inspired title animations
🖱 Custom Cursor	Neon cursor with magnetic hover effects
💻 Terminal Typewriter	Animated terminal interface
📊 Counter Animation	Smooth animated statistics
🎬 Scroll Reveal	Scroll-triggered section animations
🌐 Infinite Grid	Moving futuristic background
📺 CRT Scanlines	Retro monitor visual effect
💎 Glassmorphism UI	Frosted cards with neon glow
📱 Fully Responsive	Optimized for desktop, tablet and mobile

---

🖼 Preview

Landing Page

Add screenshot or GIF here

---

🚀 Experience

Visitor
      │
      ▼
Landing Animation
      │
      ▼
Particle Background
      │
      ▼
Hero Section
      │
      ▼
Glitch Effects
      │
      ▼
Interactive Scrolling
      │
      ▼
Animated Showcase

---

🎨 Visual Design

Color Palette

Color	Hex
🔵 Neon Cyan	#00F5FF
🩷 Neon Pink	#FF006E
💛 Neon Yellow	#FFE600
⚫ Deep Space	#020408

---

💻 Technology Stack

Technology	Purpose
🌐 HTML5	Structure
🎨 CSS3	Styling & Animation
⚡ JavaScript	Interactive Features
🎯 Canvas API	Particle Engine
👁 Intersection Observer	Scroll Animations

---

📂 Project Structure

📦 nexus

├── 📄 index.html
├── 📂 assets
│   ├── images
│   ├── icons
│   └── preview.gif
│
├── 📂 screenshots
│
└── 📄 README.md

---

🚀 Getting Started

Clone the repository

git clone https://github.com/tasnem-tech/nexus.git

Navigate to the project

cd nexus

Open directly in your browser

index.html

No installation required.

No build process.

No frameworks.

---

📈 Animations Included

• 🌌 Interactive Particle Engine
• ⚡ Hero Glitch Animation
• 💻 Terminal Typewriter
• 📊 Animated Statistics
• 🖱 Neon Cursor
• 🌊 Smooth Scroll Reveal
• 🌐 Infinite Moving Grid
• ✨ Glassmorphism Effects

---

🎯 Skills Demonstrated

• Frontend Development
• HTML5
• CSS3 Animations
• Vanilla JavaScript
• Canvas API
• UI Animation
• Responsive Design
• Modern Web Design

---

🔮 Future Roadmap

• 🌍 Three.js 3D Background
• 🌠 Interactive Starfield
• 🎵 Ambient Sound Effects
• 🌗 Light/Dark Themes
• 🌍 Multi-page Navigation
• 📱 Progressive Web App
• ⚡ GSAP Animation Integration
• 🎮 Interactive Mini Games

---

🌟 Why NEXUS?

Unlike many landing page templates, NEXUS focuses on creating an immersive user experience through handcrafted animations and modern frontend techniques—without relying on heavy frameworks or libraries.

It demonstrates practical skills in responsive layout, motion design, JavaScript interactions, and visual storytelling.

---

👨‍💻 Author

Tasnem Islam Prome

Frontend Developer • UI Engineer • Creative Web Developer

---

⭐ If you enjoyed this project, consider giving it a Star!