Complete Design Reference

One unified reference merging the Phase 1 core app (12 screens), the Phase 2 ecosystem (12 modules, 116+ screens), and 6 newly-scoped modules sourced from the product roadmap. Every screen shares one design system — same tokens, typography, and components throughout.

How every screen connects — from first launch through the bottom-nav core app into the full ecosystem reached via the "Other" tab. Solid lines are primary navigation; dashed lines are secondary/contextual jumps (e.g. "Ask AI" buttons).

Premium pairing: scholarly serif for display, geometric sans for UI. Both fonts support excellent multilingual rendering through Flutter's Noto fallback.

Live palette editor — pick any color and every screen on this page updates instantly. Use this to test alternate palettes before implementing in Flutter.

Live component gallery — all variants rendered with current tokens. Change any color above and these update instantly.

Branded launch screen. Logo + tagline, subtle animation. Sets first impression before data loads.

5-slide tour introducing key features. Shown once on first install. Dots indicator + Skip/Next flow.

Clean, spacious layout. Panchang data displayed clearly without ornamental borders or glow effects. Gold used only on active indicators.

Clean data grid with clear label hierarchy. Inauspicious/auspicious periods marked with subtle left border accent — no heavy color fills.

Month grid with tithi subscript. Today marked with primary fill. Festival dots as subtle indicators. Clean day-detail card below.

Full-page view for a single festival — significance, rituals, timings, and reminder CTA. Reachable from Festival list and Calendar day detail.

Choghadiya timeline for the current day — highlights the active period, shows all day/night slots with auspicious/inauspicious badges.

Vedic gochar (transit) horoscope — shows natal moon rashi, current transit house, and daily prediction with category ratings. Falls back to static zodiac rashifal if no birth profile.

Birth chart result screen — North Indian diamond-style chart via CustomPainter, planetary positions, and house details. Entry point for AI chat and matching.

Conversational Kundli AI chat. Message bubbles, suggested questions, offline state, markdown rendering.

User account with birth chart summary, feature unlock status, and activity overview.

Subscription paywall with pricing tiers, feature comparison, and free trial CTA.

Modal overlays for confirmations, pickers, and contextual input. All use a scrim at 40% opacity with 300ms fade.

Consistent motion language across the app. Purposeful — never decorative. Reduced-motion users get instant transitions.

Applied uniformly across all screens. Clean, minimal — no decorative elements in error or empty states.

WCAG 2.1 AA compliance targets. Every interactive element reachable, every state announced.

12 life-event categories, each with best dates, time slots, checklists, FAQs, and AI suggestions. Pattern: category grid → detail with tabs.

Full birth chart analysis with 3 chart styles, Navamsa, Dasha periods, Dosha analysis, and life-area predictions. Pattern: tabbed chart view → analysis sections.

Conversational AI across all domains — Panchang, Muhurat, Kundli, Rituals, Festivals, Sanskrit. Chat bubble pattern with suggested questions and voice.

Service marketplace: pandit booking, consultations, temple puja, astrologers, vastu, gemstones. Pattern: service grid → provider list → booking flow → reviews.

Rich festival experience: landing page, timeline, stories, videos, shopping guide, recipes, decorations, gallery, countdown.

Scripture reading, mantras, shlokas with audio. Pattern: content library → reader with audio player → bookmarks → progress tracking.

Meditation, yoga, ayurveda, temple directory, pilgrimage planner, daily routines. Pattern: activity cards → guided session → progress.

Discussion forum, Q&A, photo sharing, events, challenges, badges, leaderboards, temple reviews. Pattern: feed → post detail → profile achievements.

Companion for Nakshatraya wearable: dashboard, battery, firmware, accessories, warranty, repair, registration, gift packaging.

Spiritual products: books, yantras, puja kits, incense, gemstones. Pattern: product grid → detail → cart → checkout → order tracking.

Subscription tiers, benefits, billing, member dashboard, exclusive content, founder sessions.

Language, notifications, theme, accessibility, privacy, connected devices, support. Standard list pattern with section headers.

Four breakpoints govern layout across mobile, tablet, expanded, and desktop. Module-specific overrides listed below.

How design tokens map to Flutter Material 3 colorScheme and architecture patterns for each module.

Articles, categories, bookmarks, search, trending, share. A blog/content platform — distinct from Learning (which covers scriptures). Pattern: category feed → article reader → bookmarks.

Notification history and settings in one place. Users need to see past notifications and manage every reminder type from a single hub.

Global search across the entire app — festivals, panchang terms, articles, and pandits. Reached from the Home Dashboard search icon.

Distinct from Profile — this is about saved content, history, downloads, and achievements. Reached from Profile.

Invite friends, earn rewards. Reached from Profile — referral code, rewards balance, coupons, and a leaderboard.

WhatsApp support, feedback, and bug reporting. Reached from Settings — help center with FAQ and direct contact options.