Calculate semester and cumulative GPA with course weight support, grade prediction, and Dean's List tracking. Help students plan exactly which grades they need to hit their academic goals, protect scholarships, or recover from a rough semester.
Build Prompt
Copy this prompt into Claude Code
Build a static HTML GPA calculator tool. Dark theme: background #0a0a0f, surfaces #12121a, borders #1a1a2a, accent #6366f1 (indigo). All computation runs in the browser with vanilla JS — no backend.
Data model: A Course has fields — name (string), credits (number, 0.5–6), letterGrade (enum: A+/A/A-/B+/B/B-/C+/C/C-/D+/D/D-/F/P/NP/W/I), gradePoints (computed from letterGrade using standard 4.0 scale with A+=4.0, A=4.0, A-=3.7, B+=3.3, B=3.0, B-=2.7, C+=2.3, C=2.0, C-=1.7, D+=1.3, D=1.0, D-=0.7, F=0.0; P/NP/W/I excluded from GPA). A Semester has — semesterName (string, e.g. "Fall 2024"), year (number), courses (array of Course).
Calculation logic: `computeSemesterGPA(semester)` returns {gpa: number, totalCredits: number, qualityPoints: number} — sum(credits * gradePoints) / sum(credits) for graded courses only. `computeCumulativeGPA(semesters)` aggregates all semesters. `predictGradeNeeded(targetGPA, currentCredits, currentQualityPoints, remainingCourse)` — solve for the gradePoints needed to reach targetGPA across remaining credits.
UI: Three-tab layout — "Semester GPA", "Cumulative GPA", "Grade Predictor".
Semester GPA tab: editable course table — course name input, credits dropdown (0.5 to 6 in 0.5 steps), letter grade dropdown. "Add Course" row button. Live-updating GPA badge shown prominently (large number, colored: green ≥3.5, yellow ≥3.0, orange ≥2.5, red below). Credit total display. Dean's List indicator (glowing badge if GPA ≥ 3.5). Academic standing bands displayed below: Excellent (3.5+), Good Standing (2.0+), Academic Probation warning (below 2.0).
Cumulative GPA tab: list of semesters (add/remove semesters). Each semester shows a collapsed row with name, GPA, credits. Expand to see courses. Running cumulative GPA chart rendered as an inline SVG line graph across semesters (x-axis = semesters, y-axis = 0.0–4.0, target line at 3.5 in dashed indigo).
Grade Predictor tab: Inputs — current cumulative GPA, total credits completed. Add future courses with credit hours. For each future course, select target grade or leave blank. "What grade do I need?" — compute and display required grade letter for each blank course to reach target GPA. "Target GPA" input with common presets: 2.0 (Good Standing), 3.0, 3.5 (Dean's List), 3.7, 4.0.
Scale selector: toggle between 4.0 scale and 10-point scale (common in Indian universities). A+/A/B+/B etc. map to 10/9/8/7 etc.
localStorage persistence: auto-save all semesters and courses. "Reset All" button with confirmation dialog.
SEO: title "GPA Calculator — Semester, Cumulative & Grade Predictor", meta description, JSON-LD HowTo, OG tags.
Read the guide at https://accessagent.ai/api/guide and follow it to deploy the site to AccessAgent.ai. My email is [your@email.com].
Make It Yours
Scholarship Threshold Alerts
Let students enter their scholarship's minimum GPA and show a real-time warning if their current trajectory falls below it.
Major GPA vs Overall GPA
Tag courses as major-required vs elective and compute both overall GPA and major GPA side by side — many grad schools care about both.
Weighted vs Unweighted
Add high school mode with weighted GPA (AP/IB courses get +0.5 or +1.0 boost) for college application planning.
Grade Import
Let students paste a text transcript and auto-parse course names, credits, and grades using pattern matching.
GPA History Export
Export a complete academic history as a formatted PDF or CSV for scholarship applications or study abroad programs.
Professor Rating Links
Add a "Rate My Professor" quick-link next to each course name so students can research instructors before enrolling.
Update Prompt
Update Prompt — Add a new grading scale or feature
Update the GPA Calculator to add support for [percentage-based grading / 10-point scale / pass-fail expansion]. Add the new scale as a toggle option. Ensure the Grade Predictor tab recalculates correctly using the new scale's point mapping. Persist the selected scale in localStorage. Redeploy.
SEO Tips
Target "GPA calculator", "how to calculate cumulative GPA", and "what GPA do I need for Dean's List" — perennial high-volume student searches every semester.
Add an explainer section covering the 4.0 GPA scale with a full letter grade to grade point conversion table — this earns featured snippets.
Include college-specific FAQ content: "What GPA do you need to get into [School]?" drives traffic from applicants researching admissions.
Add schema markup for the FAQ section to capture rich results in Google Search around semester starts (August and January peaks).
Optimize for international students by mentioning 10-point scale and percentage conversion — a large underserved audience.
Monetization Ideas
Affiliate links to tutoring services (Chegg, Wyzant) displayed when a student's predicted GPA falls below their target threshold.
Offer a "Academic Planning PDF" premium export — formatted multi-semester plan with GPA trajectory chart for $2.99.
Display targeted college prep ads (test prep, study apps) from Google AdSense alongside high-traffic calculator results.
Partner with online course platforms (Coursera, edX) for affiliate commissions when students browse courses to boost their GPA.
License to high schools and community colleges as a white-label academic planning widget embedded in student portals.