Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a personal finance management web app designed to help users input their income and expenses effectively. It provides a comprehensive dashboard that displays key financial insights, allowing users to monitor their budgeting, track spending, and manage their finances efficiently.

## CORE FEATURES
1. **Income and Expense Tracking**: Users can easily input their salary, income sources, and various expenses to keep an accurate record of their financial activities.
2. **Dashboard Overview**: A visually appealing dashboard that showcases income vs. expenses, savings goals, and spending habits in an easily digestible format.
3. **Budget Planning**: Users can create and manage budgets for different categories to ensure they stay within their financial limits.
4. **Reports and Analytics**: Generate visual reports that help users analyze their financial patterns over time, including monthly spending trends and income growth.
5. **Notifications and Alerts**: Users receive reminders for upcoming bills or alerts when they exceed budget limits, promoting proactive financial management.
6. **User Authentication**: Secure login system for users to protect their financial data and maintain privacy.

## 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 consist of a top navigation bar, a side menu for accessing different features, and a central dashboard area displaying various financial metrics and charts.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux for managing user state and financial data

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Authentication System**: Implement user authentication using a secure method (e.g., JWT) to protect user data.
3. **Design Dashboard Layout**: Develop the main layout with a navigation bar, side menu, and dashboard area using Tailwind CSS for styling.
4. **Build Core Features**:
   - Implement income and expense input forms.
   - Create the dashboard component to display income, expenses, and visual reports.
   - Develop budget planning and tracking functionalities.
5. **Integrate Notifications**: Set up a notification system to alert users about important financial events.
6. **Testing and Deployment**: Conduct thorough testing to ensure functionality and usability, followed by deployment to a hosting platform.

## USER EXPERIENCE
Users will begin by logging into their accounts, where they will be greeted with an intuitive dashboard displaying their financial information at a glance. They can quickly add income and expenses through simple forms, which will update the dashboard in real-time. Users can navigate through budgeting tools and reports with ease, enjoying a seamless experience that prioritizes clarity and accessibility. The responsive design ensures a consistent experience across devices, allowing users to manage their finances on the go.