Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to showcase a modern hero section that emphasizes clean aesthetics and effective communication. The goal is to create a visually appealing introduction that captures user interest and encourages them to explore further.

## CORE FEATURES
1. **Hero Section**: A prominent hero area featuring a captivating headline, a brief description, and a compelling call-to-action (CTA) button.
2. **Visual Elements**: Incorporation of high-quality images or illustrations that align with the brand identity and resonate with the target audience.
3. **Responsive Design**: Ensures that the hero section looks great on all devices, from desktops to mobile phones.
4. **Brand Colors**: Utilization of specified color combinations to create a cohesive and inviting atmosphere that reflects the brand's personality.

## 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 will feature a full-width hero section with a centered headline and description, accompanied by a prominent CTA button below the text. The background will be light grey, ensuring a clean and spacious feel.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Not required for this static landing page

## IMPLEMENTATION STEPS
1. Set up a new React project using Create React App with TypeScript.
2. Install Tailwind CSS and configure it to work with your React setup.
3. Create a new component for the Hero Section, ensuring the layout follows the specified design.
4. Integrate the Inter font from Google Fonts into the project for both headings and body text.
5. Apply the primary color (#1978E5) to the CTA button and other key interactive elements.
6. Style the hero section using Tailwind CSS classes to achieve the minimalist look, ensuring proper spacing and alignment.
7. Test the responsiveness of the hero section across different devices to ensure optimal user experience.

## USER EXPERIENCE
The user will be greeted by a visually striking hero section that instantly conveys the brand's message. The clear headline and succinct description will guide users toward the CTA button, inviting them to take action—be it signing up, learning more, or exploring the website. The minimalist design will enhance focus on the content, making navigation intuitive and engaging.