Lovable Prompt Creator - AI Prompt Generator

```markdown
## APPLICATION OVERVIEW
This project is a web application that allows users to create personalized profiles by adding customizable widgets, such as images, text, links, and titles. Users can manage their content in both desktop and mobile viewports, ensuring a seamless and responsive experience. The application emphasizes a minimalist design, focusing on usability and aesthetic appeal.

## CORE FEATURES
1. **Widget Management**: Users can add, remove, and customize various widgets (image, text, link, title) on their profile. Each widget can have specific attributes, such as an image link for the image widget.
2. **Dual Viewports**: The application features separate desktop and mobile viewports. Changes made in one mode do not affect the other, but adding a widget in one mode will reflect in the other.
3. **Mobile Toggle Simulator**: In desktop mode, users can toggle to a mobile view simulator, allowing them to see how their content will appear on mobile. Changes made in this mode will be applied to the actual mobile view.
4. **Theme Selector**: Users can change the overall theme of their profile page, providing customization options for aesthetics.
5. **Profile Layout**: In desktop mode, the profile info (avatar, name, bio) is positioned on the left, while the canvas for widgets is on the right. In mobile view, the profile info is displayed above the widget canvas for a streamlined experience.
6. **Title Widget Design**: The title widget will consist of raw text with no background and will span the entire row, ensuring a clean presentation.

## 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 desktop layout features a two-column design with the profile information on the left and the widget canvas on the right. The mobile layout stacks these elements vertically.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Use React Context or Redux if needed for managing state across different components.

## IMPLEMENTATION STEPS
1. Set up a new React project using TypeScript and install necessary dependencies (React, Tailwind CSS, shadcn/ui).
2. Create the main application structure with two separate routes or components for desktop and mobile views.
3. Implement the widget management system, allowing for dynamic addition and removal of widgets.
4. Develop the mobile toggle simulator feature, ensuring it accurately reflects changes made in desktop mode.
5. Create the theme selector functionality to allow users to customize the visual appearance of their profile.
6. Implement responsive design principles to ensure that the layout adapts smoothly across devices.

## USER EXPERIENCE
Users will start by signing into their profiles. They can add widgets through an intuitive interface, with clear options for customization. The dual viewport functionality will allow them to switch between desktop and mobile views effortlessly, ensuring that their profile looks great on any device. The theme selector will enhance personalization, while the minimalist design will provide a clean and focused user environment.
```