👨‍💻 Sydney Santos | Personal Portfolio

A modern, responsive personal portfolio website featuring a Bento Grid layout, built with React and the latest Tailwind CSS v4.

🎨 About The Project

This portfolio serves as a central hub to showcase my web development projects, certifications, and technical expertise. The design is inspired by the "Bento" UI trend—organizing content into clean, modular cards for a structured yet visual experience.

Live Demo: https://syd-portfolio.vercel.app/

Key Features

• Bento Grid Layout: A responsive CSS Grid system that adapts from a single column on mobile to a complex 4-column layout on desktop.
• Modern Design System: Uses a custom color palette (Royal Blue & Mint Teal) with soft "diffuse" shadows and rounded corners.
• Tailwind CSS v4: distinct usage of the new @theme configuration and CSS variables for theming.
• Component Architecture: Modular React components using Lucide icons and Shadcn/UI patterns.

🛠️ Tech Stack

Frontend:

• React.js (Vite)
• Tailwind CSS v4
• Lucide React (Icons)

Design:

• Font: Plus Jakarta Sans / Inter
• Icons: Lucide React & React Icons

📂 Featured Projects

This portfolio highlights my recent work in the MERN stack:

1. SpenSyd - A personal finance tracking application.
2. CraftMySite - A dynamic website builder.
3. Let'em Cook - A recipe sharing platform.

🚀 How to Run Locally

This project uses Vite. Follow these steps to set it up on your local machine.

1. Clone the repository

git clone [https://github.com/yourusername/portfolio.git](https://github.com/yourusername/portfolio.git)
cd portfolio