Aayushy's Portfolio

A modern, dark-themed personal portfolio website built with React, Vite, and Framer Motion.

Features

• Dark Theme: Minimalist dark gray/black design with purple accents.
• Responsive: Fully responsive layout for all devices.
• Animations: Smooth fade-in and slide-up effects using Framer Motion.
• Components:
  • Sticky Navbar
  • Hero Section
  • About (Cards)
  • Skills (Badges)
  • Projects (Grid + Modal)
  • Contact Form

Installation

1. Prerequisites: Node.js installed.
2. Install Dependencies:

   npm install

3. Run Development Server:

   npm run dev

4. Build for Production:

   npm run build

Customization

Updating Content

• Hero/About/Contact: Edit the text directly in src/components/Hero.jsx, About.jsx, etc.
• Projects: Update the projects array in src/components/Projects.jsx. Change images, descriptions, and links there.
• Skills: Update the skills list in src/components/Skills.jsx.

Changing Theme Colors

Open src/index.css and modify the CSS variables at the top:

:root {
  --bg-color: #0f0f0f;      /* Background */
  --surface-color: #1e1e1e; /* Card Background */
  --accent-color: #9747FF;  /* Purple Accent */
  --text-primary: #ffffff;  /* Headings */
  --text-secondary: #a1a1a1; /* Body text */
}

Folder Structure

src/
├── components/       # UI Components (Navbar, Hero, etc.)
├── App.jsx           # Main layout
├── main.jsx          # Entry point
├── index.css         # Global styles and variables