Design a stunning, clean, highly interactive single-page portfolio website for Harsh Pandey, a passionate Frontend Engineer. The site should be aesthetic, smooth, engaging, and without a navigation bar, offering a natural scroll flow. Sections must stack vertically.
- Hero Section (Animated) Fullscreen, minimalistic with a creative vibe.
Background: Soft pastel gradient (e.g., light purple blending into sky blue) or floating colorful abstract blobs.
Hero Content:
Profile Image Placeholder (circular or slightly rounded rectangular frame at the center or left side).
Headline: "Hi, I'm Harsh Pandey"
Subtitle: "Frontend Developer | UI/UX Enthusiast | Web Animator"
Below subtitle, an animated typewriter effect rotating through phrases:
Crafting Responsive Interfaces
Breathing Life into Designs
Building Smooth Web Experiences
A vibrant "See My Work" button:
Text: "See My Work"
Action: On click, smooth scrolls to Projects Section.
Secondary action: Open GitHub link → GitHub Profile
Smooth bouncing scroll-down indicator at bottom center.
- Work Experience Section Layout: Single card style, animated entrance on scroll.
Experience:
Position: Frontend Engineer Intern
Company: The Coerz (an Ed-Tech platform)
Duration: Ongoing (Still working)
Description: Working on building dynamic, responsive, and intuitive frontend interfaces using modern frameworks and design principles.
Tech stack badges: React, Next.js, TailwindCSS, GitHub
Background: Light textured pattern with soft color accents.
- Featured Projects Section Display 2 featured project cards side-by-side or in a centered vertical stack.
Each card includes:
Project Title: Big and prominent
Short Description: One catchy line about the project.
GitHub Link Button (primary action) styled beautifully.
Smooth hover animation (lift, glow, slight zoom).
Projects: Movie Verse
Description: "A movie search platform using React and OMDB API."
GitHub: Movie-Verse GitHub Repo
Manga Management System
Description: "A library management system built for manga lovers."
GitHub: Manga-Library-Management-System Repo
- Skills Section Layout: Beautiful animated skill badges + animated progress bars.
Categorized skills:
Frontend Technologies: React, Next.js, HTML, CSS, JavaScript
Styling Tools: TailwindCSS, Figma, Framer Motion
Other Skills: GitHub, APIs, Responsive Web Design
Fun micro-interactions like hover effects or subtle bouncing animations.
- Footer Clean, motivational footer.
Quote: "Design is intelligence made visible." – Alina Wheeler
Social media icons: GitHub, LinkedIn (if available), Email (animated on hover: bounce, glow).
Small personal note: "Built with ❤️ by Harsh Pandey using React & TailwindCSS."
Subtle animated background — maybe a slow-moving pastel gradient or abstract animated waves.
Harsh Pandey's Portfolio Website
I've designed a stunning, interactive single-page portfolio for Harsh Pandey with smooth animations, engaging sections, and a natural scroll flow.
Key Features
Stunning Hero Section
- Animated Background: Soft pastel gradient with floating colorful abstract blobs that move subtly
- Typewriter Effect: Rotating phrases showcasing Harsh's skills
- Smooth Animations: Fade-in and slide-up animations for all elements
- Call-to-Action: "See My Work" button that smoothly scrolls to the Projects section
Work Experience Section
- Animated Card: Clean card design with subtle entrance animation
- Tech Stack Badges: Visual representation of technologies used
- Responsive Layout: Adapts beautifully to all screen sizes
Featured Projects Section
- Interactive Cards: Hover animations with lift effect
- GitHub Links: Direct links to project repositories
- Clean Typography: Clear hierarchy with prominent project titles
Skills Section
- Animated Progress Bars: Visual representation of skill proficiency
- Categorized Skills: Organized into Frontend, Styling, and Other skills
- Micro-interactions: Smooth animations on scroll
Footer
- Social Links: GitHub, LinkedIn, and Email with hover animations
- Inspirational Quote: "Design is intelligence made visible." – Alina Wheeler
- Personal Touch: "Built with ❤️ by Harsh Pandey using React & TailwindCSS"
Additional Features
- Scroll Progress Bar: Visual indicator of scroll position
- Dark Mode Support: Elegant transitions between light and dark themes
- Fully Responsive: Looks great on all devices from mobile to desktop
- Smooth Scrolling: Natural flow between sections
The portfolio showcases Harsh's skills as a Frontend Engineer through both content and implementation, featuring modern animations, clean design, and thoughtful interactions.
Alright, here are some of the feew changes that need too be done: 1) In the button of github profile in hero section, add this git link: "https://github.com/HarshPandey-5804" 2) in the same hero section, in placeholder of image, add this image that i am uploading. 3) in title of every section, remove the underline please. 4) Finnaly, add a small thought befroe the footer part.
I'll make those changes to the portfolio website. Let me update the code with your requested modifications:
- Update the GitHub profile link
- Add your profile image
- Remove underlines from section titles
- Add a thought section before the footer
I've made all the requested changes to your portfolio website:
- ✅ Updated the GitHub profile link to "https://github.com/HarshPandey-5804" in the hero section
- ✅ Added your profile image to replace the placeholder
- ✅ Removed the underlines from all section titles (Work Experience, Featured Projects, and Skills & Expertise)
- ✅ Added a thoughtful quote section before the footer with a personal reflection on web development
The profile image has been added and will display in the circular frame at the top of the page. The thought section features an elegant card design with a personal philosophy about web development that aligns with your role as a Frontend Engineer.
All animations and other functionality remain intact, with these specific changes implemented as requested.
Hey, some last few changes: 1) While I am scrolling down to my skillas section. pplease remove the after effect that is removing the content. 2) Edit the hero section by moving all the content to left side, and also adding a bit of introsuction about me: "Web development enthusiast, currently learning and keen to collaborate on projects. Passionate about creating impactful web experiences and expanding my skills"