personal-portfolio — HTML Portfolio Template

SHA-256: 88c7a5d456e1764b4dbd370ad6145361d13695925ab37bcf09301ee3e1f1355a

2026-10-13T06:55:02.327Z

<div align="center">

# Portfolio — Pruthvi Kauticwar

### A modern, responsive portfolio website built with vanilla web technologies

[![Live Site](https://img.shields.io/badge/Live_Site-portfolio.kpruthvi.com-4A90E2?style=for-the-badge&labelColor=2C3E50)](https://portfolio.kpruthvi.com)
[![License](https://img.shields.io/badge/License-MIT-00D084?style=for-the-badge&labelColor=2C3E50)](LICENSE)
[![Cloudflare](https://img.shields.io/badge/Hosted_on-Cloudflare_Pages-F38020?style=for-the-badge&logo=cloudflare&logoColor=white&labelColor=2C3E50)](https://pages.cloudflare.com)

<br>

**Professional • Responsive • Fast • Focused**

</div>

<br>

## About

A professional portfolio website showcasing my work experience, technical skills, and projects. Built with a focus on **performance**, **accessibility**, and **clean design** — no frameworks, just pure HTML, CSS, and JavaScript.

<div align="center">

### **[→ View Live Site ←](https://portfolio.kpruthvi.com)**

</div>

<br>

## Features

<table>
<tr>
<td width="50%">

### Design & UX
- **Fully Responsive** — Optimized for all screen sizes
- **Theme Toggle** — Seamless dark/light mode switching
- **Print-Optimized** — Dedicated print-friendly resume view
- **Smooth Animations** — Polished transitions and interactions

</td>
<td width="50%">

### Technical
- **SEO Optimized** — Complete with sitemap and meta tags
- **Fast & Lightweight** — Pure vanilla web technologies
- **Modern CSS** — Grid, Flexbox, Custom Properties
- **Semantic HTML** — Accessible and well-structured

</td>
</tr>
</table>

<br>

## Tech Stack

<table>
<thead>
<tr>
<th align="left">Category</th>
<th align="left">Technologies</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Frontend</strong></td>
<td><code>HTML5</code> <code>CSS3</code> <code>JavaScript</code></td>
</tr>
<tr>
<td><strong>Styling</strong></td>
<td><code>CSS Custom Properties</code> <code>Flexbox</code> <code>Grid</code></td>
</tr>
<tr>
<td><strong>Hosting</strong></td>
<td><code>Cloudflare Pages</code></td>
</tr>
<tr>
<td><strong>Deployment</strong></td>
<td><code>Git-based CI/CD</code></td>
</tr>
</tbody>
</table>

<br>

## Project Structure

```
personal-portfolio/
│
├── index.html              # Main portfolio page
├── resume.html             # Interactive resume/CV
├── resume-print.html       # Print-optimized resume
│
├── css/                    # Stylesheets
│   ├── styles.css          # Global styles
│   ├── theme.css           # Theme variables
│   └── ...                 # Component-specific styles
│
├── js/                     # JavaScript modules
│   ├── theme-toggle.js     # Dark/light mode logic
│   └── ...                 # Interactive features
│
├── sitemap.xml             # SEO sitemap
└── LICENSE                 # MIT License
```

<br>

## Local Development

### Quick Start

<table>
<tr>
<td width="50%">

**Option 1: Direct File Access**
```bash
# Simply open in your browser
open index.html
```

</td>
<td width="50%">

**Option 2: Local Server** (Recommended)
```bash
# Python 3
python -m http.server 8000

# Node.js
npx serve
```
Then visit `http://localhost:8000`

</td>
</tr>
</table>

<br>

## Deployment

This project uses **Cloudflare Pages** for automatic deployments:

```
1. Push changes to main branch
2. Cloudflare Pages auto-builds
3. Changes are live within seconds
```

> No build process required — it's pure static HTML!

<br>

## Pages

<table>
<thead>
<tr>
<th align="left">Page</th>
<th align="left">URL</th>
<th align="left">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Home</strong></td>
<td><code>/</code></td>
<td>Main portfolio showcasing projects and skills</td>
</tr>
<tr>
<td><strong>Resume</strong></td>
<td><code>/resume.html</code></td>
<td>Interactive resume/CV with full experience details</td>
</tr>
<tr>
<td><strong>Print Resume</strong></td>
<td><code>/resume-print.html</code></td>
<td>Print-optimized version for PDF generation</td>
</tr>
</tbody>
</table>

<br>

## Browser Support

<div align="center">

![Chrome](https://img.shields.io/badge/Chrome-Latest-4285F4?style=flat-square&logo=googlechrome&logoColor=white)
![Firefox](https://img.shields.io/badge/Firefox-Latest-FF7139?style=flat-square&logo=firefox&logoColor=white)
![Safari](https://img.shields.io/badge/Safari-Latest-000000?style=flat-square&logo=safari&logoColor=white)
![Edge](https://img.shields.io/badge/Edge-Latest-0078D7?style=flat-square&logo=microsoftedge&logoColor=white)

</div>

<br>

## License

This project is licensed under the **MIT License** — see the [LICENSE](LICENSE) file for details.

<br>

---

<div align="center">

**Built with precision by Pruthvi Kauticwar**

<br>

[![Visit Portfolio](https://img.shields.io/badge/Visit_Portfolio-4A90E2?style=for-the-badge&logoColor=white)](https://portfolio.kpruthvi.com)
[![Report Bug](https://img.shields.io/badge/Report_Bug-E74C3C?style=for-the-badge&logoColor=white)](https://github.com/pruthvi2805/personal-portfolio/issues)

</div>