profile0

A clean, responsive personal portfolio website built using **HTML & CSS **.
This project showcases my skills, projects, and contact information in a simple and elegant way — with smooth animations and a minimal UI.

🚀 Features

✔ Fully Responsive Design

The layout adapts perfectly across desktops, tablets, and mobile devices.

✔ Lavender Themed UI

Soft gradients, pastel shades, rounded corners, and a clean aesthetic.

✔ Animated Hero Section

Profile image with soft shadow + clean intro layout.

✔ Sliding Project Image Animation (CSS-only)

Each project card automatically:

• slides the first image out,
• brings the second image in,
• loops smoothly using keyframe animations.

✔ Smooth Hover Effects

Buttons, skills, and cards have smooth transitions.

✔ Back to Top Button

A fixed button that stays at the bottom-right of the screen and scrolls smoothly to the top.

✔ Contact Form UI

A clean and styled form (UI only, no backend).

---

📁 Project Structure

/Portfolio │── index.html │── style.css │── profile.jpeg │── project1.1.png │── project1.2.jpg │── project2.1.jpg │── project2.2.jpg │── README.md

---

🛠️ Tech Used

• HTML5
• CSS3
  • Flexbox
  • Grid
  • Animations
  • Transitions
  • Positioning
  • Box Model

No JavaScript used.

---

🎨 Key CSS Concepts Demonstrated

• CSS Variables
• Smooth transitions
• Keyframe animations
• Sticky header
• Responsive grid layouts
• Fixed positioning
• Form styling
• Hover effects

📸 Preview

Includes:

• Hero section
• Skills grid
• Project auto-slider
• Contact form
• Footer
• Back-to-top button

📦 How to Use

1. Download or clone the repository.
2. Place all images in the same folder as index.html unless paths are changed.
3. Open index.html in your browser.

📝 Future Enhancements

• Add JavaScript form validation
• Add more project categories
• Add dark/light theme toggle
• Add GSAP/Scroll animations