Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed for a Roblox-themed website that showcases offerings related to the game. The main purpose is to attract users with engaging content, highlight key features, and encourage visitors to take action, such as signing up or exploring more.

## CORE FEATURES
1. **Hero Section**: A captivating introduction with a strong headline and a call-to-action button that invites visitors to learn more or join the community.
2. **Features Display**: A section that outlines the key features of the website, such as game guides, community forums, and exclusive content.
3. **Testimonials**: User reviews and testimonials to build credibility and trust among potential users.
4. **Call to Action**: Prominent buttons throughout the page that encourage users to sign up or get involved.
5. **Contact Form**: A simple form for users to reach out for more information or assistance.

## 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 consists of a full-width hero section at the top, followed by a features section laid out in a grid format, a testimonials section with user quotes, and a footer with contact information and social media links.

## TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: Not necessary for a simple landing page.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Components**:
   - Build a `Hero` component featuring a headline, subheadline, and call-to-action button styled with Tailwind CSS.
   - Create a `Features` component that displays a grid of the website's key features with icons and descriptions.
   - Develop a `Testimonials` component that showcases user feedback in a visually appealing format.
   - Implement a `Contact` form component for user inquiries.
3. **Layout and Styling**: Use Tailwind CSS to lay out the components according to the specifications, ensuring responsiveness across devices.
4. **Integrate Components**: Assemble the components into the main application layout, ensuring the hero section is first, followed by features, testimonials, and the contact form.
5. **Testing and Optimization**: Test the landing page for usability, ensuring all buttons and forms function correctly and the design is consistent.

## USER EXPERIENCE
Users visiting the landing page will be greeted by a visually appealing hero section that captures their interest. They can easily navigate through the features and testimonials, encouraging them to engage with the content. The clear call-to-action buttons facilitate quick access to sign up or learn more, while the contact form allows for straightforward communication with the site administrators. The minimalist design ensures that users are not overwhelmed and can focus on the content that matters most.