Pennyzo Web

A modern React TypeScript web application for Pennyzo, built with Tailwind CSS and custom branding.

Features

• React 18 with TypeScript for type safety
• Tailwind CSS with custom color palette
• Responsive design with mobile-first approach
• Sticky navigation header
• Custom brand colors: deep-navy, brass, off-white, light-gray

Getting Started

1. Install dependencies:

   npm install
   

2. Start the development server:

   npm run dev
   

3. Open http://localhost:3000 to view it in the browser.

Custom Colors

The project includes a custom Tailwind color palette:

• deep-navy: #0A192F
• brass: #D4AF37
• off-white: #F8F8F8
• light-gray: #CCD6F6

Project Structure

src/
├── components/
│   ├── Header.tsx          # Main navigation header
│   ├── HeroSection.tsx     # Hero section with CTA
│   ├── FeaturesSection.tsx # Features grid with cards
│   ├── WhyPennyzoSection.tsx # Benefits section
│   └── Footer.tsx          # Footer with links and contact info
├── App.tsx                 # Main application component
├── index.tsx              # Application entry point
└── index.css              # Tailwind CSS imports

Available Scripts

• npm run dev - Runs the app in development mode with Vite
• npm run build - Builds the app for production
• npm run preview - Preview the production build locally