Free and open-source AI-powered economics diagram editor built for IB students and educators.
IB EconGraph AI is a web-based diagram editor designed specifically for the IB Economics curriculum. Generate publication-ready economic diagrams instantly with AI, or draw them manually with intuitive tools. Export in different image formats for your Internal Assessments (IAs), presentations, and papers.
- AI-Powered Generation: Describe any economics concept in plain English and get an accurate, labeled diagram generated by Google Gemini AI.
- Manual Drawing Tools: Draw curves, lines, points, and shapes with precision. Drag entire curves or individual control points.
- Component Library: 15+ pre-built templates including Supply & Demand, Monopoly, Tax Incidence, Negative Externalities, and more.
- Area Shading: Shade consumer surplus, producer surplus, deadweight/welfare loss, tax revenue, and other regions.
- Smart Snapping: Snap to grid and existing points for pixel-perfect alignment.
- Project Organization: Organize diagrams into projects. Search, rename, and manage your work.
- Export: Export diagrams as high-quality SVG files or PNG and JPEG images.
- Import/Export Data: Back up and restore all your graphs, projects, and color palettes as JSON.
- Customizable Colors: Full color palette with custom color support.
- Keyboard Shortcuts: Undo/redo (Ctrl+Z/Y), tool switching (S, B, L, C, P, T, F, E, H), and more.
- Cloud Sync (Supporter): Diagrams synced across devices with version history.
- Shareable Links (Supporter): Send a view-only link of a diagram or project to a teacher or group partner.
- Hosted AI (Supporter): AI generation with no API key setup, 150 generations/month included.
- Custom Templates (Supporter): Save your own curve setups as reusable, synced templates.
Everything a student needs to finish their IA is free and unlimited, forever.
That means unlimited diagrams and projects, every drawing tool and template, all export formats at full quality with no watermark, unlimited AI generation with your own free API key (BYOK), and local JSON backup/restore. None of this will ever move behind a paywall.
The optional Supporter plan ($5/month or $50/year) adds hosted conveniences (hosted AI without API keys, cloud sync with version history, share links, synced custom templates) and keeps the project alive. See the pricing page and how we compare to other tools.
- React 19 with TypeScript
- Vite for build tooling
- Tailwind CSS for styling
- Google Gemini AI / OpenRouter (BYOK) for diagram generation
- Lucide React for icons
- Supabase (auth + Postgres + RLS) for optional accounts & cloud sync
- Polar (merchant of record) for optional Supporter subscriptions
- Vercel serverless functions for hosted AI & billing endpoints
You can either use the Live Site or run the project locally.
Visit the Live Site to get started. No installation required. Just enter your Google AI Studio API key in the Settings page and start creating diagrams for free.
Follow the steps below to run the project locally. Useful for development or testing.
- Node.js (v18 or later)
- A Google AI Studio API key (free)
git clone https://github.com/sukarth/IB-EconGraph-AI.git
cd IB-EconGraph-AI
npm installEnter your API key in the app's Settings page after launching. No .env file is
needed for the core app.
To self-host the optional cloud features (accounts, sync, Supporter billing, hosted AI), see docs/BACKEND_SETUP.md and .env.example. Everything degrades gracefully when unconfigured, so a fork with no backend keys is simply the full free/local app.
npm run devOpens the site at http://localhost:4000.
npm run build
npm run previewTo serve the production build locally.
├── App.tsx # Main application component + routing
├── index.html # HTML entry point with SEO meta tags
├── index.tsx # React DOM initialization
├── types.ts / paletteTypes.ts # TypeScript type definitions
├── vite.config.ts # Vite config + dev-only API function shim
├── vercel.json # Routing, rewrites and function limits
├── .env.example # Every supported environment variable
├── .github/workflows/
│ ├── db-keepalive.yml # Pings the DB so a free project never pauses
│ └── update-supporters.yml # Weekly README supporters refresh
├── api/ # Vercel serverless functions
│ ├── generate.ts # Hosted AI generation (metered, Supporter)
│ ├── usage.ts # Hosted AI usage meter
│ ├── checkout.ts / portal.ts # Polar billing
│ ├── delete-account.ts # Account + data deletion (cancels billing first)
│ ├── webhooks/polar.ts # Subscription state webhook
│ └── _lib/ # Server-only helpers (Supabase admin, Polar)
├── supabase/schema.sql # Database schema + RLS policies
├── docs/BACKEND_SETUP.md # Cloud/billing self-hosting guide
├── scripts/
│ ├── generate-seo-pages.mjs # Build-time static SEO pages + sitemap
│ ├── seo-content.mjs # Per-diagram-type page content
│ └── update-supporters.mjs # README supporters list updater
├── components/
│ ├── LandingPage.tsx # Marketing/landing page
│ ├── PricingPage.tsx # Free-forever guarantee + Supporter plan
│ ├── ComparePage.tsx # Comparison vs other econ diagram tools
│ ├── LegalPages.tsx # Privacy Policy + Terms of Service
│ ├── HomePage.tsx # Dashboard with graph management
│ ├── SettingsPage.tsx # API keys, account, sync, data management
│ ├── SharedViewPage.tsx # Public read-only share viewer (/s/:slug)
│ ├── DiagramRenderer.tsx # SVG canvas and drawing engine
│ ├── ComponentLibrary.tsx # Built-in + custom (synced) templates
│ ├── AccountSection.tsx # Account & Cloud settings card
│ ├── AuthModal.tsx / ShareModal.tsx / CloudHistoryModal.tsx
│ ├── ToolbarLeft.tsx # Drawing tools panel
│ ├── ToolbarRight.tsx # Utility controls (undo, zoom, export)
│ ├── Modal.tsx # Modal components
│ └── usePortalTooltip.tsx # Tooltip hook
└── services/
├── ai.ts / aiProvider.ts # Provider facade (Gemini, OpenRouter, hosted)
├── gemini.ts / openrouter.ts / hostedAi.ts
├── diagramPrompt.ts # Shared AI prompt + schema (client & server)
├── auth.tsx # Auth context (Supabase)
├── entitlement.ts # Single source of truth for the Pro rule
├── sync.ts / useCloudSync.ts # Local-first cloud sync engine
├── shares.ts / customTemplates.ts / billing.ts
├── cloudErrors.ts / keyObfuscation.ts # Shared helpers
└── supabaseClient.ts
Supply & Demand · Monopoly · Perfect Competition · Negative Externalities · Positive Externalities · Price Controls (floors & ceilings) · Tariffs & Quotas · Tax Incidence · PPC Curves · Exchange Rates · Consumer & Producer Surplus · Deadweight Loss · and more.
Contributions are welcome. Please open an issue first to discuss what you'd like to change.
- Fork the repository
- Create your feature branch (
git checkout -b feature/my-feature) - Commit your changes (
git commit -m 'Add my feature') - Push to the branch (
git push origin feature/my-feature) - Open a Pull Request
By contributing, you agree that your contributions are licensed under the project's AGPL-3.0 license.
Copyright (c) 2025-2026 Sukarth Acharya.
Distributed under the GNU Affero General Public License v3.0 (AGPL-3.0). See LICENSE for the full text.
In plain terms: you are free to use, study, modify, and share this code. If you run a modified version as a network service (for example, a hosted copy other people can use), the AGPL requires you to make your modified source available to those users, under the same license. That keeps the project and its improvements open for everyone.
The AGPL covers the code. It does not grant rights to the project's name, logo, or branding: "IB EconGraph AI", the EconGraph name, and the project logo are reserved by the author and are not licensed for reuse.
You are welcome to fork, self-host, and build on this project. If you publish or operate your own version, please run it under your own name and branding, and keep the attribution and source-code offer that the AGPL requires. Do not present a fork as the official IB EconGraph AI or imply it is endorsed by or affiliated with this project.
Below are some planned features for the future. Feel free to contribute or suggest additional features!
- Support for more diagram types (e.g. Lorenz curves, IS-LM models)
- Real-time collaborative editing
- Mobile-friendly interface
- More AI customization options (e.g. style, complexity)
- Dark mode
- Classroom plan for teachers (one license, whole class gets Supporter). If there's demand, open an issue to register interest.
A huge thank-you to the Supporters keeping this project free for every student. (Become one; you can opt in to be listed here from Settings.)
Become the first. See the Supporter plan.
If this project saves you time, consider supporting my work. It keeps these tools free, open source, and maintained:
If you can't donate, but nonetheless found the project useful, please consider supporting it by starring the repo ⭐ and sharing it with your friends. Your support helps me keep improving the project and means a lot to me. Thank you! 🙏
Built with ❤️ by Sukarth for IB Economics students and educators everywhere.