5 days ago
Create a modern, premium mobile UI layout inspired by high-end fintech apps like the reference design. Use the following style principles: • Large rounded cards (16–24dp radius) with soft shadows. • Pastel gradient backgrounds for account cards (mint green, light blue, soft grey). • Clean white background with plenty of spacing. • Minimal thin icons, soft corners, and subtle dividers. • Hero typography: bold black text for titles. • Soft, floating UI elements with blurred shadows. • Circular floating action button with + icon. • Flat bottom bar or floating toolbar. Generate wireframes for the following screens: 1. Onboarding Screen - Large hero text: “Your Financial Navigator” - Subtext paragraph - Soft artistic line illustration placeholder - Two layered gradient balance cards (slightly rotated for depth) - Large primary button “Get Started” - Very minimal layout with lots of white space 2. Dashboard Screen - Top bar with profile photo, greeting, and notification icon - Horizontal scrollable balance cards (blue, mint) - Each card includes: - Currency flag icon - “Your balance” label - Large balance text - Account number (last 4 digits) - Valid thru date or wallet name - Action shortcuts under card: Request / Transfer - Floating + button in bottom right 3. Transactions Section - Section title “Transaction” - Small “View all” link - List of transactions: - Icon (thin circular arrow) - Title text - Amount text (green for income, red for expense) - Date/time in light grey - Bottom floating action bar for navigation (home, chart, wallet, settings) General styling: - Layout: 16–24dp padding on sides - Font: Clean sans-serif, bold headings, light body text - Shadows: Soft, blurred, spread 20dp - Colors: Pastel gradients, monochrome text, light subtle icons - Alignment: Centered major cards, minimalist UI
Windframe is an AI visual editor for rapidly building stunning web UIs & websites
Start building stunning web UIs & websites!
