Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed to mimic a Roblox gifting platform for Robux. It will allow users to learn about the gifting process, view promotional offers, and facilitate transactions in a clean, minimalist environment. The focus will be on user experience and providing straightforward navigation.

## CORE FEATURES
1. **Hero Section**: A prominent introduction area showcasing the value proposition of gifting Robux, including an eye-catching tagline and a call-to-action button.
2. **Features Overview**: A section detailing the benefits of using the platform, including easy transactions, secure gifting, and promotional offers.
3. **Gifting Process**: An interactive guide or step-by-step procedure outlining how users can gift Robux, enhancing user understanding and engagement.
4. **Testimonials**: A section for user reviews or success stories to build trust and credibility among potential users.
5. **Contact Information**: A simple contact form for inquiries, allowing users to reach out for support or additional information.
6. **Promotional Offers**: Display current deals or discounts related to Robux gifting to incentivize user action.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography
- **Color Mode**: Light theme with dark text on light backgrounds
- **Primary Color**: #1978E5 (accent for buttons, links, highlights)
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs
- **Layout**: The layout will follow a single-page design with a top navigation menu, smooth scrolling to sections, and a visually appealing arrangement of hero, features, testimonials, and contact form sections.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand (to manage global state if needed)

## IMPLEMENTATION STEPS
1. **Set up the Development Environment**: Initialize a new React application using Create React App with TypeScript support.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling components.
3. **Create the Layout Structure**: Build a top navigation bar that links to different sections of the landing page.
4. **Develop the Hero Section**: Implement the hero section with a tagline and CTA button, styled with the primary color and typography.
5. **Build the Features Section**: Create individual feature blocks that explain the gifting process and its benefits using cards or grid layout.
6. **Implement Testimonials**: Add a testimonials section, using a carousel or grid layout to showcase user reviews.
7. **Create the Contact Form**: Develop a simple contact form with fields for name, email, and message, ensuring it matches the design specifications.
8. **Add Background Styles**: Ensure background colors and text contrast are appropriate for a light theme.
9. **Test Responsiveness**: Utilize Tailwind's responsive utilities to ensure the application looks good on all devices.
10. **Deploy the Application**: Host the final application on a service like Vercel or Netlify for public access.

## USER EXPERIENCE
Users will land on a visually appealing hero section that immediately communicates the purpose of the application. They will be able to scroll to learn about the gifting process, view testimonials that build trust, and easily access the contact form for any questions. The minimalist design will provide a distraction-free experience, focusing users on the content and actions that matter most. Smooth transitions and responsive design will enhance overall usability, ensuring a seamless interaction across devices.