A single-page, sci-fi/cyberpunk themed landing page built for a fictional neural augmentation platform called NEXUS-7. Created as part of the Techfest IIT Bombay Campus Ambassador content tasks.
Live demo: ishhwarrii.github.io/Techfest-Cyborg-Landing
NEXUS-7 markets itself as a "next-generation cyborg intelligence platform" merging biological cognition with machine precision. The page leans into a dark, HUD-style aesthetic — scanlines, glitch text, glowing cyan/violet accents, and monospace display type — to sell that near-future tech feel.
- HTML5 — single self-contained file, no build step
- CSS3 — custom properties (CSS variables), Grid & Flexbox layouts, keyframe animations
- Fonts: Orbitron (display/headings) + Inter (body text), loaded via Google Fonts
- No JavaScript, no frameworks, no dependencies — pure HTML/CSS
| Section | Description |
|---|---|
| Nav | Fixed header with blurred glass background, logo, and anchor links |
| Hero | Animated grid background, glitch-effect headline, HUD stat readouts (Neural Sync, Latency, Memory Ext., Augmented Users) |
| Capabilities | 6 feature cards — Neural Interface, Cognitive Vault, Sensory Augmentation, Predictive Engine, Biomechanical Sync, Secure Comms |
| Augmentation Stack | 4-layer architecture breakdown (L1–L4: Biological Foundation → Nano-mesh Interface → Edge Compute Array → Consciousness Shell), paired with a rotating ring visual |
| System Readiness | Animated progress bars for performance benchmarks (Rejection Rate, Neural Sync Accuracy, Cognitive Throughput, etc.) |
| Field Reports | Testimonial cards from fictional "augmented" users |
| CTA Banner | Closing call-to-action |
| Footer | Logo + copyright |
--cyan: #00f5ff;
--violet: #7b2fff;
--dark: #0a0a0f;
--panel: #0f0f1a;
--panel2: #13131f;
--chrome: #c8d8e8;
--muted: #6a7a8a;Signature effects:
- Full-page scanline overlay
- Pulsing "system online" indicator dot
- Text glitch animation on the hero headline (every ~6s)
- Slow-spinning concentric rings in the Augmentation Stack visual
- Scale-in animated progress bars
Breakpoint at 768px:
- Nav links collapse (logo only)
- HUD stats wrap to a 2-column grid
- Augmentation Stack switches to single column
- Footer stacks vertically and centers
Techfest-Cyborg-Landing/
└── index.html # everything — markup, styles, and animations in one file
No install needed — it's a static file.
git clone https://github.com/ishhwarrii/Techfest-Cyborg-Landing.git
cd Techfest-Cyborg-Landing
open index.html # or just double-click itHosted via GitHub Pages directly from this repo.
Designed & built by Ishwari Deshmukh (@ishhwarrii) as a Techfest IIT Bombay Campus Ambassador content deliverable.