Aryan Parikh - Data Science & ML Portfolio

A minimalist, data-centric portfolio built with React and Tailwind CSS, designed for a Data Scientist. Features a dark navy theme with subtle borders and muted blue/terminal green accents.

Tech Stack

• React 18 - Functional components with hooks
• Tailwind CSS - Utility-first styling with custom design tokens
• Lucide React - Icon library
• Vite - Build tool and dev server

Design System

The portfolio uses a custom color palette extracted from the Stitch design:

• Background: #0b1326 (Deep navy)
• Surface: #171f33 (Elevated surfaces)
• Primary: #98cbff (Python blue)
• Secondary: #4edea3 (Terminal green)
• Text: #dae2fd (On surface)
• Borders: #41474f (Outline)

Typography:

• Inter - Body text and headlines
• JetBrains Mono - Code, labels, and technical text

Getting Started

1. Install dependencies:

npm install

2. Start the development server:

npm run dev

3. Build for production:

npm run build

Project Structure

portfolio/
├── src/
│   ├── components/
│   │   ├── Header.jsx
│   │   ├── Hero.jsx
│   │   ├── TechnicalArsenal.jsx
│   │   ├── ProjectCard.jsx
│   │   ├── FeaturedProjects.jsx
│   │   ├── TimelineItem.jsx
│   │   ├── Experience.jsx
│   │   └── Footer.jsx
│   ├── App.jsx
│   ├── main.jsx
│   └── index.css
├── index.html
├── tailwind.config.js
├── postcss.config.js
├── vite.config.js
└── package.json

Components

• Header - Sticky navigation with name and links
• Hero - Introduction with green status badge and social links
• TechnicalArsenal - 3-column grid of skill cards
• FeaturedProjects - Project cards with file tab styling
• Experience - Vertical timeline layout
• Footer - Simple footer with social links