Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The "roboux saner" is a minimalist landing page designed to present a clean and simple interface that effectively communicates the brand's value proposition. Its primary purpose is to engage visitors, showcase key features, and drive conversions through clear calls to action.

## CORE FEATURES
1. **Hero Section**: A prominent opening area with a compelling headline, brief description, and a strong call to action button to encourage user engagement.
2. **Features Overview**: A section dedicated to showcasing the main features of the service, with concise descriptions and icons to visually represent each feature.
3. **Testimonials**: A section that highlights user feedback or case studies, enhancing credibility and trust.
4. **Call to Action (CTA)**: A strategically placed CTA inviting users to sign up or learn more, ensuring clear pathways for conversion.
5. **Contact Information**: A simple contact section with a form for inquiries and additional information, allowing potential customers to reach out easily.

## 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**: A single-page layout with a vertical flow, including sections for the hero, features, testimonials, CTA, and contact information, ensuring a seamless user experience.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Not required for a landing page but can be implemented if needed for interactive components.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Create a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Layout Structure**: Implement a single-page layout using React Router for navigation if applicable.
4. **Build Hero Section**: Design and implement the hero section with a headline, description, and CTA button styled with Tailwind CSS.
5. **Develop Features Overview**: Create a section that displays features using cards, ensuring they are visually distinct and aligned.
6. **Add Testimonials Section**: Implement a testimonial carousel or grid layout that showcases user reviews.
7. **Implement CTA**: Design a visually appealing CTA section to encourage user interaction.
8. **Create Contact Form**: Build a simple contact form that handles user inquiries.
9. **Responsive Design**: Ensure the layout is fully responsive across devices with Tailwind CSS utilities.
10. **Testing and Optimization**: Test the landing page for usability, performance, and responsiveness before deployment.

## USER EXPERIENCE
The user experience will focus on simplicity and clarity, guiding users through the page without distractions. Visitors will first encounter the hero section, immediately drawing their attention to the main message. As they scroll, they will seamlessly transition through features and testimonials, reinforcing the value of the offering. The CTA will be clearly visible and accessible, making it easy for users to take the next step. The contact section will provide a straightforward way for users to reach out for more information, ensuring a cohesive and engaging experience throughout the landing page.