Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The "fakerobuxgift" project is a minimalist landing page designed to promote a service that allows users to generate or gift virtual currency, specifically Robux for Roblox. The main purpose of this landing page is to attract visitors, explain the service offerings, and encourage them to take action, such as signing up or making a gift.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a compelling headline, brief description, and a prominent call-to-action (CTA) button to encourage users to start using the service.
2. **How It Works**: A simple explanation of the process for generating or gifting Robux, presented in an easy-to-understand format, possibly using icons or illustrations.
3. **Benefits**: Highlight the advantages of using the service, such as ease of use, security, and user testimonials to build credibility.
4. **FAQs**: A section that addresses common questions or concerns that potential users might have about the service.
5. **Contact Form**: A straightforward form where users can enter their details to get in touch for support or inquiries.
6. **Footer**: Links to social media profiles, terms of service, and privacy policy, ensuring users have all necessary information readily available.

## 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 main layout structure will be a single column format with sections stacked vertically, ensuring simplicity and ease of navigation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this landing page as it is primarily informational.

## IMPLEMENTATION STEPS
1. **Set Up the Project**:
   - Create a new React project with TypeScript and install Tailwind CSS.
   - Set up shadcn/ui for UI components.

2. **Create the Hero Section**:
   - Design a hero section with a background color matching the primary color, a large heading, a brief description, and a CTA button.

3. **Develop the How It Works Section**:
   - Use a simple grid layout to display steps with icons or illustrations explaining the process.

4. **Build the Benefits Section**:
   - Create a card layout to showcase different benefits, using the primary color for highlights.

5. **Add the FAQs Section**:
   - Implement an accordion or toggle feature for users to click and reveal answers to common questions.

6. **Implement the Contact Form**:
   - Design a simple contact form with fields for name, email, and message, ensuring it aligns with the overall design.

7. **Finalize the Footer**:
   - Add social media links and important legal information, ensuring they are visually consistent with the rest of the page.

8. **Responsive Design**:
   - Ensure the layout is responsive, adjusting to different screen sizes while maintaining usability and aesthetics.

## USER EXPERIENCE
The landing page will provide a seamless experience, guiding users from the hero section through to the benefits and FAQs. The CTA button will be prominently displayed, encouraging users to engage with the service. The contact form will allow users to easily reach out for more information, ensuring they feel supported and informed throughout their visit. The overall focus on typography and ample white space will create an inviting atmosphere that enhances user interaction.