<<<<<<< HEAD

Modern Landing Page

A beautiful, responsive landing page built with React (Vite) and Tailwind CSS.

Features

• ⚡ Fast Development - Built with Vite for lightning-fast development
• 🎨 Modern Design - Clean, professional design with Tailwind CSS
• 📱 Fully Responsive - Works perfectly on all devices and screen sizes
• ♿ Accessible - Built with accessibility best practices
• 🧩 Component-Based - Modular React components for easy maintenance
• 🎯 TypeScript - Full TypeScript support for better development experience

Components

• Header - Navigation with mobile hamburger menu
• Hero - Eye-catching hero section with call-to-action
• Features - Showcase of key features with icons
• About - Company information and team section
• CTA - Call-to-action section with email signup
• Footer - Links and social media icons

Getting Started

Prerequisites

• Node.js (version 16 or higher)
• npm or yarn

Installation

1. Clone the repository or navigate to the project directory

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

4. Open your browser and visit http://localhost:5173

Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run preview - Preview production build
• npm run lint - Run ESLint

Project Structure

src/
├── components/
│   ├── Header.tsx      # Navigation component
│   ├── Hero.tsx        # Hero section
│   ├── Features.tsx    # Features showcase
│   ├── About.tsx       # About section
│   ├── CTA.tsx         # Call-to-action
│   └── Footer.tsx      # Footer component
├── App.tsx             # Main app component
├── main.tsx           # Entry point
└── index.css          # Tailwind CSS imports

Customization

Colors

The design uses a primary color scheme based on Indigo. To change the color scheme, update the Tailwind classes throughout the components:

• bg-indigo-600 → bg-yourcolor-600
• text-indigo-600 → text-yourcolor-600
• hover:bg-indigo-700 → hover:bg-yourcolor-700

Content

Update the content in each component file:

• Brand Name: Update "BrandName" in Header.tsx and Footer.tsx
• Hero Content: Modify text and CTAs in Hero.tsx
• Features: Add/remove/modify features in Features.tsx
• Team: Update team member information in About.tsx

Images

Replace placeholder images with your own:

• Team member photos in About.tsx
• Testimonial photos in CTA.tsx

Deployment

Build for Production

npm run build

The built files will be in the dist/ directory, ready for deployment to any static hosting service like:

• Vercel
• Netlify
• GitHub Pages
• Firebase Hosting
• AWS S3

Technologies Used

• React 19 - UI framework
• TypeScript - Type safety
• Vite - Build tool and dev server
• Tailwind CSS - Utility-first CSS framework
• ESLint - Code linting

Browser Support

• Chrome (latest)
• Firefox (latest)
• Safari (latest)
• Edge (latest)

License

This project is open source and available under the MIT License.

cursorapp1

0d81c2bb067cddef3ae61394d546eda4dddf2ec7