An interactive, modern portfolio template featuring 3D visuals, smooth animations, micro-interactions, and an AI chat assistant. Perfect for developers and designers who want to showcase their work in a truly standout way.
Hero Section
- Animated 4-color gradient background
- Three.js wireframe icosahedron rotation
- 3D hover & float profile avatar
- 3D rotate-in title and subtitle
- Pop-in, tilt & glow skills capsules
Timeline Section
- GSAP + ScrollTrigger 3D helix of event cards
- Interactive tsParticles background
- Fade-in & glow on hover cards
Projects Section
- Responsive 1–3 column grid
- Mouse-driven 3D tilt on hover
- Slide-up overlay titles
- Click to open modal with details
Contact Section
- Glassmorphism form with floating labels
- Cursor-driven 3D tilt effect
- HTML5 validation & button ripple
AI Chatbot Widget
- Three.js canvas “cosmos” toggle icon
- Glassmorphic chat popup with 3D robot icon
- Typing dots & letter-by-letter AI replies
- PHP
chat.phpprocessor +vedant_knowledge.txtkeyword replies - Quick suggestions bar
- DiceBear AI avatar & version badge
Navigation Bar
- Floating transparent capsule with icon-only links
- 3D lift, shine & perfect circle highlight on hover
- Auto-hide on scroll down, reappear on scroll up
- Smooth drop-in load animation
Footer
- Minimal trademark: “© 2025 NeonFusion. Crafted with passion • Powered by innovation.”
- Subtle fade-in on load
SEO & Meta
- Meta tags: description, keywords, Open Graph, Twitter card
- Favicon & social preview image
- JSON-LD Person schema
- HTML5 / CSS3 / JavaScript (ES6+)
- Three.js (3D icon & robot animations)
- GSAP + ScrollTrigger (scroll-driven helix & reveals)
- tsParticles (interactive particles)
- Anime.js (micro-animations)
- PHP (
chat.php) + vedant_knowledge.txt (AI responses) - Google Fonts: Poppins, Roboto
- DiceBear for avatars
- Colors & Fonts: Tweak CSS variables in
:root - 3D Models: Swap geometries or materials in Three.js scripts
- AI Logic: Enhance
chat.phpwith more keywords or integrate NLP APIs - Sections: Reorder, hide, or duplicate section templates (
#hero,#timeline,#projects,#contact, etc.)
MIT License © 2025 NeonFusion Feel free to use, modify, and distribute this template for personal or commercial projects.