ASTROAYODHYA.COM
Free Kundali Page — Complete Page Document
Route: /kundali  |  Doc v1.0  |  Developer + Designer Reference
Table of Contents
Section 0: Page Overview & User Journey
Section 1: Page Layout Structure
Section 2: Step 1 — Birth Data Input Form
Section 3: Step 2 — Chart Generation & Loading State
Section 4: Step 3 — Kundali Chart Display (D1)
Section 5: Step 4 — Planet Table & Basic Analysis
Section 6: Step 5 — Email Gate (Lead Capture)
Section 7: Step 6 — Locked Sections & Upsell
Section 8: Divisional Charts Tab System
Section 9: Dasha Timeline Preview
Section 10:Dosha Detection Panel
Section 11:Remedy & Product Recommendations
Section 12:Paid Forecast Upsell Section
Section 13:Right Sidebar — Sticky Panel
Section 14:Below-Chart Content (SEO Articles)
Section 15:Foundation Integration on This Page
Section 16:SEO, Schema & Performance Spec
Section 17:Mobile Responsiveness
Appendix:Components, API Calls, State Machine, Validation Rules
SECTION 0 — Page Overview & User Journey
0.1  Why This Page Is #1 Priority
'Free kundali' aur 'janam kundali banana' — yeh India ke sabse zyada search hone wale astrology keywords hain. AstroSage ne 80 million downloads sirf is ek feature pe kiye. Yeh page AstroAyodhya ka traffic engine hai.
Competitor analysis: 
0.2  Complete User Journey — 7 Steps
SECTION 1 — Page Layout Structure
1.1  Layout States
1.2  URL Structure & Query Params
NOTE: If DOB params are in URL from homepage form, auto-submit the form. User should see chart directly — no re-entry needed.
SECTION 2 — Step 1: Birth Data Input Form
2.1  Form Header
Title: "Apni Kundali Banao — Bilkul Free"
Subtitle: "Janam ki date, time aur jagah dalo — baaki hum karenge"
Badge: "🕯 Ayodhya ke Pandit se Verified  •  Swiss Ephemeris Engine  •  100% Free"
2.2  Form Fields — Complete Specification
IMPORTANT: Time of Birth 'Pata Nahi' (Unknown Time) toggle — when selected: TOB defaults to 12:00 noon, and a disclaimer shows: 'Approximate time pe kundali banegi — kuch results accurate nahi honge.' Lagna calculation will show as 'Uncertain'.
2.3  'Pata Nahi' Toggle — TOB Unknown State
Checkbox below TOB field: 'Bilkul exact time pata nahi hai'. When checked:
TOB field becomes disabled (grey state)
System uses Solar Noon (12:00) as default
Chart generates with note: 'Approximate Kundali — Lagna aur kuch bhav uncertain hain'
All house-dependent calculations shown with '~' prefix (approximately)
Upsell CTA appears: 'Exact time jaanne ke liye Acharya se poocho — ₹499 mein Prashn Kundali banao'
2.4  CTA Button
Button text: "Meri Kundali Banao →"
Style: Full width. Saffron background. White text. 52px height. Border-radius 8px. Font: DM Sans 16px bold.
Loading state: Button shows spinner + 'Kundali ban rahi hai...' — disabled during API call.
Error state: If API fails: 'Kuch problem aayi — dobara try karo.' with retry button.
2.5  Below Form — Trust Indicators
Three inline trust items below the button:
'🔒 Aapka data safe hai — kabhi share nahi hoga'
'⚡ Result 2 second mein'
'✅ 25 Lakh+ log pehle se bana chuke hain'
2.6  Google Places API Integration
DEV: Use Google Places Autocomplete restricted to 'cities' type. On city selection, auto-fetch lat/lng and timezone. Store: city_name, lat, lng, timezone_offset, country_code in form state. Timezone critical for accurate chart.
SECTION 3 — Step 2: Chart Generation & Loading State
3.1  Loading Animation Sequence
3.2  Loading Messages — Rotating Text
Below the spinner, rotate through these messages every 0.8 seconds:
"Planet positions calculate ho rahe hain..."
"Aapka Lagna aur Rashi dekh rahe hain..."
"16 chart types ban rahe hain..."
"Ayodhya ke Acharya ji ki Vedic wisdom apply ho rahi hai..."
"Aapki Mahadasha timeline taiyaar ho rahi hai..."
SECTION 4 — Step 3: Kundali Chart Display (D1 Rashi Chart)
4.1  Chart Header — Above Chart
4.2  D1 Chart SVG Specification
Chart structure:
Outer square divided into 12 house triangles/sections (North Indian format)
Houses numbered 1-12. House 1 (Lagna) at top center.
Planet symbols inside their respective houses — abbreviated: Su/Mo/Ma/Me/Ju/Ve/Sa/Ra/Ke
Retrograde planets shown with 'R' superscript — e.g. 'MeR'
Exalted planets shown with 'U' (Uccha) superscript
Debilitated planets shown with 'N' (Neech) superscript
Combust planets shown in orange color
Rashi names inside each house in small Devanagari (Hindi) script
Degree positions shown on hover tooltip: 'Surya 18° Kanya'
Hover interactions:
Hover on planet symbol → tooltip: Full planet name + degree + rashi + speed
Hover on house → tooltip: House number + signification (e.g. '7th Bhava — Vivah, Partnership')
Click on planet → highlight all aspects of that planet in blue
Click on house → show house lord + planets in that house in detail panel
Colors:
Benefic planets (Guru, Shukra, Budh, Chandra) — blue text
Malefic planets (Shani, Mangal, Rahu, Ketu, Surya) — red text
Neutral (context-based) — black
Retrograde — italic style
Chart border: saffron (#D97706). House lines: dark grey.
4.3  Chart Toggle — North/South Indian Format
Small toggle above chart: 'North Indian ▼ | South Indian' — switches chart format. North Indian default for most users.
DEV: Store user preference in localStorage. Default: North Indian for Hindi/UP users (detected by language setting or IP).
SECTION 5 — Step 4: Planet Table & Basic Analysis
5.1  Planet Positions Table
5.2  Basic Analysis Summary — 4 Key Readings
Below planet table. 4 cards in a 2×2 grid:
SECTION 6 — Step 5: Email Gate (Lead Capture)
6.1  Email Gate Triggers — When to Show
6.2  Email Gate Design — Inline (Not Modal)
IMPORTANT: Email gate should be an INLINE section that appears in the page — NOT a full-screen modal popup. Modals cause frustration. Show it as a soft gate: blur the content below and show the form over it.
Gate appearance:
Content below gate gets a CSS blur (filter: blur(4px)) + gradient overlay
Email form appears IN the page flow — not floating
White card with saffron border. No full-screen overlay.
User can still see the blurred content below — this creates curiosity
Gate card content:
Heading: 'Yeh Free Hai — Bas Save Karo'
Subtext: 'Apni kundali save karne ke liye email ya phone dein — koi spam nahi'
Email input: placeholder 'Aapka email address'
OR phone: 'Ya phone number se' (OTP flow)
CTA button: 'Kundali Save Karo aur Unlock Karo →' — saffron
Below CTA: 'Google se login karo' button (one-click)
Privacy note: '🔒 Koi spam nahi. Kabhi bhi unsubscribe kar sakte ho.'
6.3  What Unlocks After Email
SECTION 7 — Step 6: Locked Sections & Paid Upsell
7.1  Lock System — Three Tiers
7.2  Locked Section UI Design
Locked sections dikhte hain but blurred aur padlock icon ke saath:
Content is rendered at 20% opacity with blur(6px)
Padlock icon (🔒) centered on top of blurred content
Text below lock: 'Yeh content unlock karne ke liye...' + specific CTA
CTA button per locked section — not generic 'upgrade'
Lock-specific CTAs:
SECTION 8 — Divisional Charts Tab System
8.1  Chart Tab Navigation
Below D1 chart — horizontal scrollable tab bar with all 16 divisional charts:
8.2  D9 Navamsa — Special Treatment
D9 Navamsa is the second most important chart after D1 — especially for marriage matters.
Lock message for D9: 'Navamsa chart se aapki shaadi ka samay, partner ka swabhav, aur vivah sukh pata chalta hai — ₹99 mein full forecast mein milega.'
SECTION 9 — Dasha Timeline Preview
9.1  Free Preview — What's Visible
Full Mahadasha timeline visible — all 9 periods (birth to ~120 years)
Current Mahadasha highlighted with 'ABHI' (Now) badge
Start/end dates for each Mahadasha shown
Click on current Mahadasha → shows current Antardasha (free)
Click on future/past Mahadasha → shows lock: 'Full Dasha details ₹99 mein'
9.2  Timeline Visual Design
9.3  9 Mahadasha Durations — Reference
SECTION 10 — Dosha Detection Panel
10.1  Dosha Panel Header
Title: "Aapki Kundali Mein Dosha Check"
Subtext: "Yeh sab automatically aapki kundali se detect hua hai"
10.2  8 Doshas Checked — Display Format
10.3  Dosha Card Design
Each dosha = one card. Card design:
Top row: Dosha name (Hindi + English) + Result badge (Hai / Nahi Hai)
'Hai' badge: red background — 'Aapko [Dosha Name] Hai'
'Nahi Hai' badge: green — 'Aapko [Dosha Name] Nahi Hai'
Below badge: 1-line explanation (free) — 'Mangal aapke 7th house mein hai'
Locked section: 'Iska poora matlab aur remedy jaanne ke liye →' CTA
If dosha is present: card has subtle red left border
If dosha absent: card has subtle green left border
SECTION 11 — Remedy & Product Recommendations
11.1  Remedy Section Header
Title: "Aapki Kundali Ke Hisaab Se Kya Karna Chahiye"
Subtext: "Yeh sirf aapke liye hai — kisi aur ko same list nahi milegi"
11.2  Recommendation Cards — Types
11.3  Product Card Design
Each recommendation card contains:
Product image (60×60px)
Product name + category
'Kyun?' (Why?) — 1-line chart-based reasoning: 'Aapka Shani weak hai 6th house mein'
Price range: 'From ₹[X]'
'Dekhna Chahte Ho?' CTA → /shop/[product]
Ayodhya Certified badge on eligible products
IMPORTANT: NEVER show 6th/8th/12th lord gemstone as recommendation. Algorithm must filter these out. If Lagna is Aries and Mars is 6th/8th/12th lord — do not recommend coral.
11.4  Personalized Remedy Logic — Algorithm
DEV: Chart-to-product mapping rules (implement exactly):
Rule 1: Lagna lord gemstone is ALWAYS safe to recommend if not dusthana lord
Rule 2: Current Mahadasha lord gemstone — recommend if functional benefic
Rule 3: 9th lord (Bhagya) gemstone — recommend if not functional malefic
Rule 4: If Mangal Dosha present — recommend Red Coral (Moonga) + Hanuman puja kit
Rule 5: If Sade Sati running Phase 2 — recommend Amethyst/Blue Sapphire (after Acharya check note)
Rule 6: Nakshatra-based Rudraksha — per 27-nakshatra mapping table
Rule 7: Current Dasha lord Yantra always safe
Rule 8: Never auto-recommend Neelam, Heera, Manik without consultation flag
SECTION 12 — Paid Forecast Upsell Section
12.1  Upsell Section Position
Ye section chart ke baad aata hai — planet table, dosha panel ke neeche. Full-width saffron/dark background.
12.2  Upsell Headline — Personalized
Personalized headline example: 
"Aapka Shani Mahadasha 2026 mein shuru ho raha hai — kya aap taiyaar hain?"
Headline is dynamically generated from chart data: current/upcoming Mahadasha, major transits, doshas present.
12.3  4 Forecast Cards on Kundali Page
Personalized upsell text below cards: 
"Aapke Shani Mahadasha ke agle 3 saal mein kya hoga — career mein kab break milega, shaadi ka sahi waqt kab hai — yeh sab 3-Year forecast mein milega."
Trust signals below cards: 'Brahman Verified ✓  |  Ayodhya Certified  |  PDF Turant  |  7-Din Money Back'
SECTION 13 — Right Sidebar (Sticky Panel)
13.1  Sidebar Widget 1 — Quick Stats
At-a-glance key data from the chart. Always visible, no login required.
13.2  Sidebar Widget 2 — Acharya Consultation CTA
Title: "Seedha Acharya Se Baat Karo"
Shows 1 featured Acharya (most available or top-rated):
Photo (48px circular) + Name + Rating + 'Available Now' green dot
Specialization tag most relevant to user's doshas
CTA: 'Baat Karo — ₹1,499/30min' → /consultations
Below: 'Ya free mein WhatsApp pe poocho' → WhatsApp link
13.3  Sidebar Widget 3 — Foundation Impact
Title (Green): "Aapki Kundali, Kisi Ki Muskaan"
Mini foundation widget:
'Is kundali ke baad agar aap kuch kharidenge, toh uska 50% Laraware Foundation ko jaayega'
Impact counter: 'Abhi tak ₹[X] donate ho chuke hain'
Green 'Seedha Donate Karo' button → larawarefoundation.com/donate/
13.4  Sidebar Widget 4 — Today's Panchang
Small Panchang card for today's date:
Tithi: [name]
Nakshatra: [name]
Shubh Muhurat: [time range]
Rahu Kaal: [time range]
Link: 'Poora Panchang Dekho' → /panchang
SECTION 14 — Below-Chart Content (SEO Articles)
14.1  Article Sections — Below Chart
NOTE: All articles written in Easy Hindi (aam boli). Acharya authorship attribution. Internal links to relevant tool pages. Schema markup: Article with Acharya as author.
SECTION 15 — Foundation Integration on Kundali Page
15.1  Foundation Elements Present on /kundali
15.2  Foundation CTA on Kundali Page — Exact Copy
After email gate success (account created): "Shukriya! Aapki kundali save ho gayi. Aur ek khaas baat — agar aap hamare paas kuch kharidenge, toh uska 50% Laraware Welfare Foundation ko jaayega — Ayodhya ke bachon ki padhai aur budhape ke sahare ke liye."
Foundation link: 'Foundation ke baare mein jaano' → /foundation  (opens in same tab)
Donate link: 'Seedha donate karo' → https://larawarefoundation.com/donate/ (opens new tab)
SECTION 16 — SEO, Schema Markup & Performance
16.1  Target Keywords — Priority List
16.2  Schema Markup Required
WebApplication schema — applicationCategory: Astrology, Free, featureList
BreadcrumbList — Home > Free Kundali
HowTo schema — steps for creating kundali (rich snippet opportunity)
FAQPage schema — common kundali questions (if FAQ section present on page)
SoftwareApplication for the chart tool itself
16.3  Meta Tags
16.4  Performance Requirements
SECTION 17 — Mobile Responsiveness
17.1  Mobile Layout Changes
17.2  Chart Interactivity on Mobile
Pinch-to-zoom on chart SVG — enables reading planet degrees on small screen
Tap on planet → bottom sheet slides up with planet details (instead of hover tooltip)
Tap on house → bottom sheet with house signification
'Full Screen Chart' button — expands to full viewport
Swipe left/right to switch between chart tabs (D1, D2, etc.)
APPENDIX — Components, APIs & State Machine
A.1  React Components for /kundali
A.2  API Calls on /kundali
A.3  Page State Machine
The page has 4 states managed by React state:
DEV: State stored in React context (KundaliContext). Persist to sessionStorage so page refresh doesn't lose state. Chart data cached in localStorage for 7 days.
A.4  Form Validation Rules
A.5  Next Pages in Document Queue
AstroAyodhya.com — Free Kundali Page Document v1.0
Route: /kundali  |  #1 SEO Page  |  Lead Generation Engine
50% profit → larawarefoundation.com  |  A Laraware Group Initiative
Page Name | Free Kundali / Janam Kundali Page
Route | /kundali
Render Type | SSR (Server-Side Rendering) — user-specific chart data after form submit
Entry Points | Homepage CTA → /kundali  |  Direct Google search  |  Nav link
Primary Goal | User apna DOB+TOB+POB fill kare → chart generate ho → account banaye
Revenue Hook | Free chart ke baad → 'Full Forecast lo ₹99 mein' paid upsell
SEO Priority | HIGHEST — 'free kundali', 'janam kundali', 'kundli banana' — #1 target keywords
Auth State | Works without login. Email gate appears AFTER chart is shown.
SEO Title (Hi) | मुफ्त जन्म कुंडली बनाएं | Free Kundali Online | AstroAyodhya
SEO Title (En) | Free Kundali Online | Vedic Birth Chart | AstroAyodhya
Meta Desc | Apni free kundali banao — DOB, time aur jagah dalo, turant result pao. Ayodhya ke Brahman Acharyas dwara certified. Koi signup nahi chahiye.
AstroSage | Free kundali with PDF — 80M+ users. Basic chart renderer.
Astrotalk | Free kundali as lead gen — pushes to paid consultation.
GaneshaSpeaks | Free kundali PDF — generic design, no personalization.
AstroAyodhya Advantage | Brahman Verified chart + Swiss Ephemeris precision + personalized remedy suggestions + Easy Hindi copy + chart-driven product recommendations
Critical Flow
Har step ke baad ek conversion opportunity aati hai. Developer ko yeh flow exactly implement karna hai — koi shortcut nahi.
Step | User Action | System Response | Conversion Opportunity
1 | Page pe aata hai — URL se ya homepage CTA se | Form dikhata hai pre-focused on first field | —
2 | DOB + TOB + POB fill karta hai + Submit | Loading animation + Swiss Ephemeris calculation (< 2 sec) | —
3 | Chart generate hoti hai — D1 chart SVG dikhti hai | Full chart visible — planet positions, houses, basic info | 'Save karo' → email gate
4 | Chart dekhta hai, scroll karta hai | Planet table, basic lagna/rashi/nakshatra analysis, PARTIAL dosha panel | Email gate after 30 sec or scroll 60%
5 | Email/phone deta hai — account banta hai | FULL chart unlock: all doshas + partial dasha + partial forecast | Account created = lead captured
6 | Free content padhta hai | Dosha details, remedy hints, 1-year dasha preview (locked after Month 3) | 'Full forecast lo ₹99 mein' — persistent CTA
7 | Purchase karta hai ya bookmark karta hai | If purchased: forecast PDF email mein. If not: 3-day email sequence. | Revenue conversion or nurture
Layout Rule
Is page ka layout 3 alag states mein change hota hai: (A) Pre-submit — full-width form, (B) Chart visible — 2-col layout (chart left, sidebar right), (C) Logged in — full chart unlocked with all tabs.
State | Trigger | Layout
A: Empty (Pre-Submit) | Page first load | Full-width centered form card. Max-width 680px. Clean, no distraction.
B: Chart Generated (Guest) | Form submit success | 2-column: LEFT 65% = chart + tabs. RIGHT 35% = sticky sidebar with upsell.
C: Logged In (Free) | After email gate | 2-column same, but all free content unlocked. Paid sections still locked.
D: Paid User | After forecast purchase | Full content: all 5 years, all doshas, all divisional charts, download enabled.
Base URL | /kundali
Pre-filled DOB | /kundali?dob=1993-10-05&tob=13:30&pob=Ayodhya  (from homepage hero form)
Saved Chart | /kundali/[chart-id]  (after login — user's saved chart permalink)
Share URL | /kundali/share/[public-token]  (read-only shared chart)
Language | /hi/kundali  |  /en/kundali  |  /hinglish/kundali
Design Spec
White card with saffron top border (4px). Shadow: subtle. Padding: 32px desktop, 20px mobile. Max-width: 680px. Centered on page in State A. Moves to top of left column in State B.
Field | Type | Placeholder Text (Hindi) | Validation
Name (Optional) | Text input | Apna naam likhein (e.g. Amit, Priya) | Min 2 chars if filled. Optional.
Date of Birth | Date picker DD/MM/YYYY | Janam ki tarikh — DD/MM/YYYY | Required. Min: 01/01/1900. Max: today.
Time of Birth | Time picker HH:MM | Janam ka samay — jaise 14:30 (2:30 PM) | Required. If unknown: 'Pata nahi' toggle.
Place of Birth | Google Places Autocomplete | Janam ka shehar — jaise Lucknow, Delhi | Required. Must select from dropdown.
Gender (Optional) | Radio: Purush / Mahila / Other | — | Optional. Affects some interpretations.
API Key | Google Maps JS API — Places library enabled
Restriction | types: ['(cities)']  — cities only, not streets
Language | language: 'hi' for Hindi mode, 'en' for English
On Select | Fetch place details → extract geometry.location (lat,lng) + utc_offset_minutes
Fallback | If Places API fails: show manual lat/lng entry fields (hidden by default)
Pre-set cities | Ayodhya, Lucknow, Delhi, Mumbai, Kolkata, Chennai, Bangalore etc. as quick-select chips
UX Rule
Loading state bahut important hai — user ko lagna chahiye ki kuch bada ho raha hai. Ek simple spinner nahi chalega. 2-3 second ka engaging animation dikhao.
0.0 – 0.3s | Form slides up and fades out
0.3 – 0.8s | AstroAyodhya logo (🕯) fades in, centered
0.8 – 1.5s | Circular progress ring draws around logo (CSS animation)
1.5 – 2.0s | Text fades in below: 'Aapki kundali ban rahi hai...'
2.0 – 2.5s | Sub-text: 'Swiss Ephemeris engine planet positions calculate kar raha hai'
2.5s+ | If API returns: smooth transition to chart display
Timeout >5s | Show: 'Thoda waqt lag raha hai — please wait' message
Error | 'Kuch problem aayi. Dobara try karo.' with retry button
Technical Spec
Chart is an interactive SVG rendered client-side from JSON data returned by the Vedic Engine API. NOT a server-rendered image. SVG allows hover interactions, planet highlights, zoom on mobile.
Name Display | [User Name] ki Kundali  (if name given, else 'Aapki Kundali')
Birth Details | DOB: [date]  |  TOB: [time]  |  POB: [city]
Lagna Badge | Lagna: [Rashi name] — [symbol]  (saffron background pill)
Moon Sign Badge | Rashi: [Rashi name]  (gold background pill)
Nakshatra Badge | Nakshatra: [name] — [pada] Pada  (cream background pill)
Ayanamsa | Lahiri Ayanamsa  |  Calculated: [timestamp]  (small grey text)
Action buttons | [Download PDF]  [Share]  [Save Chart]  [Print]  — top right of chart card
Chart Format
North Indian square chart format (default for UP/Hindi belt). Option to switch to South Indian format in settings. Chart must be responsive — 400px to 600px wide.
Design Spec
Shown immediately below the chart. Clean table — 9 rows (one per planet) + header. Alternating row colors. Mobile: horizontally scrollable.
Column | Content | Example | Notes
Graha (Planet) | Name + symbol | 🔴 Mangal (Mars) | Color coded: red=malefic, blue=benefic
Rashi (Sign) | Name + number | Mesh (1) | Hindi name
Bhava (House) | House number | 5th Bhava | Whole-sign houses
Degree | Exact degree | 12° 34' | Shown to 2 decimal places
Nakshatra | Nakshatra + Pada | Ashwini 2 | 27 nakshatras
Status | Uccha/Neech/Swagrahi/Retro | Uccha ↑ | Color coded badge
Shadbala | Strength score | 72/100 | Progress bar visual
Card | Title | Content | Lock State
1 | Aapka Lagna | Lagna rashi name + 2-line easy Hindi description of the sign. Icon: Lagna symbol. | Fully visible (free)
2 | Aapka Rashi | Moon sign + ruling planet + 2-line description. | Fully visible (free)
3 | Aapka Nakshatra | Birth nakshatra + pada + deity + 2-line significance. | Fully visible (free)
4 | Current Mahadasha | Active Mahadasha planet + start/end dates + 2-line meaning. | Visible (free) — details locked
MOST CRITICAL UX MOMENT
Email gate galat jagah ya galat time pe dikhaya to bounce rate 80% ho jaayega. Sahi jagah hai: user ne chart dekh liya, scroll kiya, engaged hai — TAB trigger karo. Show karo value pehle, gate baad mein.
Trigger 1 (Primary) | User scrolls past 60% of the visible chart section
Trigger 2 | User clicks 'Save Chart' or 'Download PDF' button
Trigger 3 | User clicks on any locked section
Trigger 4 | 30 seconds after chart is visible (time-based fallback)
NEVER trigger when | User is on mobile and keyboard is open
Frequency | Once per session. If dismissed: show again only after 24 hours.
Unlocks (Free) | Complete dosha panel, full planet table analysis, 1-year dasha preview, save chart, share chart
Still Locked (Paid) | Month 3+ dasha details, divisional charts D2-D60, full year-wise forecast, Acharya consultation notes
Email Sequence | Post signup: Day 0 (welcome + kundali saved), Day 1 (dosha highlight), Day 3 (forecast offer ₹99)
Content | Free (Guest) | Free (Logged In) | Paid
D1 Chart Display | Visible | Visible | Visible
Planet Positions Table | Visible | Visible | Visible
Lagna/Rashi/Nakshatra | Visible | Visible | Visible
Current Mahadasha | Name + dates only | Name + dates + basic meaning | Full analysis
Dosha Detection | Names only (Mangal: YES/NO) | Details + cancellations | Full + remedies + products
Dasha Timeline | Current Maha only | Maha + Antar 1 year | Full 120-year tree
Divisional Charts | None visible | None visible | All D1-D60
Remedies / Products | None | Basic gemstone hint | Full personalized list
Forecast Predictions | None | None | 1-5 year full report
PDF Download | Not available | Chart PDF only | Full forecast PDF
Panchang for DOB | Visible | Visible | Visible
Dasha details locked | 'Poora Dasha dekho — ₹99 mein 1-Year Forecast lo'
Divisional charts locked | 'D9 Navamsa aur 15 aur charts — ₹99 mein'
Full dosha locked | 'Sab doshas ka full analysis — free mein login karo'
Forecast locked | 'Agle 1-5 saal ka haal jaano — ₹99 se shuru'
Paid Feature
Divisional charts (D2 se D60 tak) sirf paid users ko milte hain. Free users ko tab names dikhte hain lekin click karne pe lock message aata hai.
Tab | Chart Name | Purpose | Lock State
D1 | Rashi Chart | Overall life — birth chart | FREE
D2 | Hora Chart | Wealth & money | PAID
D3 | Drekkana | Siblings, courage | PAID
D4 | Chaturthamsha | Property & fortune | PAID
D7 | Saptamsha | Children & progeny | PAID
D9 | Navamsa | Marriage & dharma — most important secondary chart | PAID
D10 | Dashamsha | Career & profession | PAID
D12 | Dwadashamsha | Parents & ancestors | PAID
D16 | Shodashamsha | Vehicles & pleasures | PAID
D20 | Vimshamsha | Spiritual progress | PAID
D24 | Chaturvimshamsha | Education & learning | PAID
D27 | Saptavimshamsha | Strength & weakness | PAID
D30 | Trimshamsha | Misfortunes | PAID
D40 | Khavedamsha | Auspicious effects | PAID
D45 | Akshavedamsha | General matters | PAID
D60 | Shashtyamsha | Past life karma | PAID
Design Spec
Visual timeline component — horizontal scrollable bar showing Vimshottari Maha Dashas from birth to ~age 90. Current period highlighted in saffron. Antardasha expand-on-click.
Timeline bar | Horizontal progress bar — filled portion = life elapsed. Color gradient saffron to gold.
Maha Dasha blocks | Colored blocks proportional to duration (Shani 19yr, Guru 16yr, etc.)
Current block | Saffron border + glow effect + 'ABHI' label
Antardasha expand | Click on block → accordion expands showing sub-periods
Planet colors | Each planet has its own color: Sun=orange, Moon=silver, Mars=red, Mercury=green, Jupiter=yellow, Venus=white, Saturn=navy, Rahu=smoke, Ketu=brown
Duration labels | Each block shows planet symbol + years remaining
Ketu Mahadasha | 7 years
Shukra (Venus) Mahadasha | 20 years
Surya (Sun) Mahadasha | 6 years
Chandra (Moon) Mahadasha | 10 years
Mangal (Mars) Mahadasha | 7 years
Rahu Mahadasha | 18 years
Guru (Jupiter) Mahadasha | 16 years
Shani (Saturn) Mahadasha | 19 years
Budh (Mercury) Mahadasha | 17 years
High Intent Section
Yeh section ka user engagement sabse zyada hota hai. Log specifically 'kya mujhe Mangal dosha hai' ya 'Kaal Sarp hai ya nahi' jaanne aate hain. Yahan conversion rate highest hoti hai.
Dosha | Detection Method | Free Display | Paid Display
Mangal Dosha | Mars in 1/2/4/7/8/12 from Lagna/Moon/Venus | YES/NO badge + house position | Severity level + all 25 cancellations checked + remedies
Kaal Sarp Dosha | All 7 planets between Rahu-Ketu axis | YES/NO + which type (1 of 12) | Full type analysis + effect areas + puja recommendation
Pitra Dosha | Sun-Rahu/Saturn combinations in 9th | YES/NO | 14 types + ancestral remedy guide + Gaya pind daan info
Shani Sade Sati | Saturn transit over natal Moon | Running/Not Running + Phase | Phase analysis + 3-phase breakdown + current remedies
Shrapit Dosha | Saturn + Rahu conjunction/aspect | YES/NO | Severity + Trimbakeshwar puja details
Guru Chandal Yoga | Jupiter + Rahu/Ketu conjunction | YES/NO | House-wise effects + remedy
Vish Yoga | Moon + Saturn conjunction | YES/NO | Degree gap check + strength
Gandmool Dosha | Birth in Gandmool nakshatra | YES/NO + which nakshatra | Shanti puja details + 27th day remedy
Commerce Section
Yeh section chart-driven product recommendations dikhata hai — generic nahi, personalized. Kundali mein jo weak planets hain unke hisaab se products suggest hote hain. Yeh e-commerce engine ka core hai.
Gemstone | Top recommended ratna based on Lagna lord + current Mahadasha. With lab certification note.
Rudraksha | Mukhi recommended based on weak planets. Nepal vs Indonesia option.
Yantra | Primary yantra for current Dasha lord. Metal options shown.
Puja | Dosha-specific puja recommendation. Ayodhya online + Trimbakeshwar options.
Mantra | Beej mantra for weak planet + jaap count + day to chant.
Daan | Donation items for weak planets — what to give, to whom, on which day.
Revenue Section
Yeh section chart page ka primary revenue driver hai. User ne chart dekh liya, dosha check kar liya — ab curiosity sabse zyada hai. Yahi moment hai paid forecast sell karne ka.
Plan | Price | Highlight Content | CTA
1 Saal | ₹99 | Career + Sehat + Paise + Vivah — month-by-month. Transit alerts. | Abhi Lo →
2 Saal | ₹199 | Sab 1-year + upcoming major transit analysis + Dasha mapping | Abhi Lo →
3 Saal ★ | ₹399 | MOST POPULAR — Complete Dasha lifecycle for your 3 active years | Sabse Popular →
5 Saal | ₹499 | Full life roadmap — peak years for career, best marriage timing | Best Value →
Design Spec
35% width column on desktop. Sticky — scrolls with user up to a point then sticks. Hidden on mobile (content collapsed into main flow). Contains 3-4 widgets stacked vertically.
Lagna | [Sign Name] — [Symbol]
Rashi | [Sign Name]
Nakshatra | [Name] — [Pada]th Pada
Mahadasha | [Planet] — [Start Year] to [End Year]
Antardasha | [Sub-planet] — until [Date]
Birth Tithi | [Tithi name] — [Paksha]
Birth Nakshatra Deity | [Deity name]
SEO Purpose
Google ke liye yeh content bahut important hai. Chart page ke neeche educational articles dalne se page authority badti hai aur long-tail keywords rank karte hain.
Article Section | Content | Word Count Target
Kundali Kya Hoti Hai? | Easy Hindi mein explanation — 'Kundali ek aaina hai jo aapke janam ke samay ke planet positions ko dikhata hai...' | 300 words
Lagna Ka Matlab Kya Hai? | Lagna/Ascendant explanation — importance, how to find it, what it means | 250 words
Rashi Aur Lagna Mein Kya Fark Hai? | Common confusion — explained simply | 200 words
12 Bhavon Ka Matlab | Quick reference — each of 12 houses and what they represent in easy Hindi | 300 words
Navgrahas Ki Jaankari | 9 planets — name, symbol, signification, day, color — table format | 250 words
Kundali Kab Banwani Chahiye? | Seasonal FAQs — before marriage, new job, buying house etc. | 200 words
Foundation Top Strip | Inherited from global layout — always visible at top
Sidebar Widget | 'Aapki Kundali, Kisi Ki Muskaan' widget in right sidebar (Section 13.3)
Below Forecast Upsell | After pricing cards: 'Aapki har kharid ka 50% Laraware Foundation ko jaata hai — Ayodhya ke zaroorattmand logon ke liye'
Footer Strip | Inherited — green Foundation strip above copyright
Post-Purchase Email | After forecast purchase: email includes '₹X aapke naam se Foundation ko gaya' statement
Keyword (Hindi) | Keyword (English) | Monthly Volume (Est.) | Difficulty
मुफ्त कुंडली बनाएं | free kundali online | 8,00,000+ | High
जन्म कुंडली | janam kundali | 6,00,000+ | High
कुंडली बनाना | kundli banana | 4,00,000+ | Medium
ऑनलाइन कुंडली | online kundali | 3,50,000+ | Medium
कुंडली मिलान | kundali match | 2,00,000+ | Medium
जन्मपत्री | janmapatri | 1,50,000+ | Low
Vedic birth chart | Vedic birth chart free | 1,20,000+ | Medium
free horoscope chart | free birth chart India | 90,000+ | Low-Medium
<title> (Hi) | मुफ्त जन्म कुंडली बनाएं | Free Kundali Online | AstroAyodhya
<title> (En) | Free Kundali Online | Vedic Birth Chart | AstroAyodhya
Description | Apni free kundali banao sirf 2 minute mein. DOB, time aur jagah dalo — turant result. Ayodhya ke Brahman Acharyas dwara verified. 25 lakh+ log bana chuke hain.
og:title | Free Kundali — Ayodhya ke Brahman Pandit Se
og:image | /og-kundali.jpg — 1200×630px showing kundali chart with AstroAyodhya branding
canonical | https://astroayodhya.com/kundali/ (Hindi default)
hreflang | All 20 language variants specified
robots | index, follow — form page should be indexable
LCP | < 2.5s — Form renders immediately (SSR). Chart generates client-side after submit.
CLS | < 0.1 — Reserve chart container height (400px) before chart loads
Chart SVG size | < 50KB for D1 chart. Optimize planet labels.
API Response | Vedic Engine: < 800ms. Cache same DOB+TOB+POB for 30 days in Redis.
Google Places | Lazy load Places API — only load after user focuses on POB field
Bundle split | Chart renderer in separate chunk — lazy loaded after form submit
Priority
75%+ users will access /kundali on mobile. Form must be PERFECT on mobile. Chart must be readable on 360px screen.
Element | Desktop | Mobile
Page layout | 2-col (chart left + sidebar right) | 1-col. Sidebar widgets collapse into accordions below chart.
Form | Centered card 680px max | Full-width, 20px padding each side
Chart | 600px SVG | 320-360px SVG — auto-scales. Pinch-to-zoom enabled.
Planet table | Full width with all 7 cols | Horizontal scroll. 5 cols visible, 2 hidden (Shadbala, Nakshatra)
Dosha cards | 2-col grid | 1-col stack
Tab bar (D charts) | All tabs visible | Scrollable, 3 tabs visible at once
Upsell cards | 4-col | 1-col, Most Popular first
Sidebar | Visible 35% right col | Hidden. Content becomes inline sections below chart.
Foundation widget | In sidebar | Inline below dosha panel
Component | File Path | Notes
KundaliPage | app/kundali/page.tsx | Main page — state machine controller
BirthDataForm | components/kundali/BirthDataForm.tsx | Step 1 form — Zod validation
ChartLoadingScreen | components/kundali/ChartLoadingScreen.tsx | Animated loading state
KundaliChart | components/kundali/KundaliChart.tsx | D1 SVG chart renderer
NorthIndianChart | components/charts/NorthIndianChart.tsx | North Indian SVG format
SouthIndianChart | components/charts/SouthIndianChart.tsx | South Indian SVG format
PlanetTable | components/kundali/PlanetTable.tsx | 9-planet data table
BasicAnalysisCards | components/kundali/BasicAnalysisCards.tsx | Lagna/Rashi/Nakshatra/Dasha cards
EmailGate | components/kundali/EmailGate.tsx | Inline soft gate — blur + form
DivisionalChartTabs | components/kundali/DivisionalChartTabs.tsx | Tab switcher for D1-D60
DashaTimeline | components/kundali/DashaTimeline.tsx | Visual Dasha timeline component
DoshaPanel | components/kundali/DoshaPanel.tsx | 8 doshas detection + display
DoShaCard | components/kundali/DoshaCard.tsx | Individual dosha card
RemedyRecommendations | components/kundali/RemedyRecommendations.tsx | Chart-driven product suggest
ForecastUpsell | components/kundali/ForecastUpsell.tsx | 4-plan pricing cards
KundaliSidebar | components/kundali/KundaliSidebar.tsx | Sticky right sidebar
ChartShareModal | components/kundali/ChartShareModal.tsx | Share URL + QR code
LockedContent | components/ui/LockedContent.tsx | Blur + lock overlay HOC
FoundationSidebarWidget | components/foundation/FoundationSidebarWidget.tsx | Foundation mini-widget
Endpoint | Method | Auth | Purpose
POST /chart/compute | POST | None (guest) | Compute D1 chart from DOB+TOB+POB
GET /chart | GET | Sanctum Token | Get saved user chart
GET /chart/d9 | GET | Paid only | Navamsa chart
GET /dasha | GET | Free account | Full Dasha tree
GET /dasha/current | GET | None (guest) | Current Maha + Antar
GET /doshas | GET | Free account | All 8 dosha results
GET /remedies/recommended | GET | Free account | Personalized remedy list
POST /auth/register | POST | None | Email gate account creation
GET /foundation/stats | GET | None | Foundation counter (cache 1hr)
GET /panchang | GET | None | Today's panchang for sidebar
GET /acharyas?featured=1 | GET | None | Featured Acharya for sidebar
IDLE | Initial state. Form visible. No chart.
LOADING | Form submitted. API call in progress. Loading animation shown.
CHART_GUEST | Chart generated. Guest user. Email gate triggers at 60% scroll or 30s.
CHART_AUTHENTICATED | Email gate completed. Free account. Full free content unlocked.
CHART_PAID | Forecast purchased. All content unlocked. Download enabled.
DOB | Required. Must be valid date. Cannot be future date. Min age: 0 (newborn allowed).
TOB | Required OR 'Pata Nahi' toggle checked. If entered: valid HH:MM format.
POB | Required. Must select from Google Places dropdown (not typed manually).
Name | Optional. If entered: min 2 chars, max 60 chars, no special characters.
Gender | Optional. No validation needed.
Next: /kundali-milan | Kundali Milan (Marriage Compatibility) — Ashtakoota + dosha system
Then: /rashifal | Daily Rashifal page — all 12 rashis, daily SSG
Then: /panchang | Daily Panchang page — location-based
Then: /forecast | Forecast pricing + checkout flow
Then: /acharyas | Acharya listing + profile + booking
Then: /foundation | Foundation landing + impact page
Then: /shop | Products catalog + chart-driven recommendations
Then: /dashboard | User dashboard post-login