Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a responsive landing page designed to showcase links to various services and social media profiles, similar to Linktree. The aim is to provide users with a sleek, modern interface that presents their offerings in a straightforward manner, enhancing user engagement and accessibility.

## CORE FEATURES
1. **Hero Section**: A prominent introduction area that includes a user profile image, name, and a brief tagline to capture visitors' attention.
2. **Service Links**: A cleanly organized list of buttons or links that direct users to various services or social media profiles, allowing for easy navigation.
3. **Customizable Background**: A striking black background that conveys sophistication and modernity, complementing the overall design.
4. **Responsive Design**: A layout that adjusts seamlessly across different devices (desktops, tablets, and smartphones) to ensure an optimal viewing experience.
5. **Social Media Icons**: Easily recognizable icons that link to social media profiles, promoting connection and engagement.
6. **Contact Information**: A section for visitors to reach out, which could include an email link or a contact form.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with a focus on clarity and ease of navigation.
- **Color Mode**: Dark theme with a black background and contrasting bright text for high visibility.
- **Layout**: A single-column layout that centers content vertically, with ample spacing between sections to avoid clutter and enhance readability.
- **Typography**: Use modern sans-serif fonts such as 'Roboto' or 'Montserrat' for headings and body text, maintaining a clear hierarchy with larger sizes for headings and smaller for descriptions.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for rapid and responsive design.
- **UI Components**: Utilize shadcn/ui for pre-designed components to streamline the development process.
- **State Management**: Not required for this simple landing page.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Components**: Develop reusable components for the Hero section, Service Links, and Contact Info.
3. **Implement Layout**: Structure the main App component to include the Hero, Service Links, and Contact sections in a single-column layout.
4. **Style Components**: Use Tailwind CSS classes to apply the black background, typography, and spacing as per design specifications.
5. **Add Interactivity**: Ensure service links and social media icons are functional, linking to the respective URLs.
6. **Test Responsiveness**: Utilize browser developer tools to simulate different device sizes and confirm that the design is responsive.
7. **Deploy**: Host the landing page using platforms like Vercel or Netlify for easy access.

## USER EXPERIENCE
Visitors will land on a visually striking page with a prominent Hero section that introduces the user. As they scroll down, they will encounter a well-organized list of service links, each designed for easy access. The modern design will appeal to users, while the responsive layout ensures functionality across various devices. Contact information will be readily available to encourage engagement and inquiries.