I ported Manim to TypeScript (run 3b1B math animations in the browser)
Details
- External ID
- 47155375
- Source
- HN
- Company
- —
- Product
- I ported Manim to TypeScript (run 3b1B math animations in the browser)
- Website domain
- github.com
- Launched
- Feb. 25, 2026
- Cohort
- —
- Upvotes
- 140
- Upvotes percentile
- 0.9258760107816711
- Tags
- —
- Fetched at
- Sept. 7, 2026, 9:25 p.m.
- Updated at
- Sept. 7, 2026, 9:25 p.m.
Description
Hi HN, I'm Narek. I built Manim-Web, a TypeScript/JavaScript port of 3Blue1Brown’s popular Manim math animation engine.The Problem: Like many here, I love Manim's visual style. But setting it up locally is notoriously painful - it requires Python, FFmpeg, Cairo, and a full LaTeX distribution. It creates a massive barrier to entry, especially for students or people who just want to quickly visualize a concept.The Solution: I wanted to make it zero-setup, so I ported the engine to TypeScript. Manim-Web runs entirely client-side in the browser. No Python, no servers, no install. It runs animations in real-time at 60fps.How it works underneath: - Rendering: Uses Canvas API / WebGL (via Three.js for 3D scenes). - LaTeX: Rendered and animated via MathJax/KaTeX (no LaTeX install needed!). - API: I kept the API almost identical to the Python version (e.g., scene.play(new Transform(square, circle))), meaning existing Manim knowledge transfers over directly. - Reactivity: Updaters and ValueTrackers follow the exact same reactive pattern as the Python original.Because it's web-native, the animations are now inherently interactive (objects can be draggable/clickable) and can be embedded directly into React/Vue apps, interactive textbooks, or blogs. I also included a py2ts converter to help migrate existing scripts.Live Demo: https://maloyan.github.io/manim-web/examples GitHub: https://github.com/maloyan/manim-webIt's open-source (MIT). I'm still actively building out feature parity with the Python version, but core animations, geometry, plotting, and 3D orbiting are working great. I would love to hear your feedback, and I'll be hanging around to answer any technical questions about rendering math in the browser!
Enrichment
- Theme
- browser automation and scraping for AI
- Vertical
- Education
- Function
- Dev tools
- Audience
- Developer
- AI stance
- Not AI
- Project type
- Hobby / open-source project
- Normalized one-liner
- mathematical animation library for typescript
- Manually corrected
- False
Could you build this?
No Porting Manim to TypeScript involves reimplementing complex mathematical vector graphics, scene graphing, LaTeX rendering, and bezier curve morphing algorithms directly in the browser.
What it would actually take: Building this requires creating a browser-based 2D/3D graphics engine (using WebGL, WebGPU, or Canvas) that translates Cairo and FFmpeg operations into Web APIs, alongside a browser-compatible LaTeX typesetting pipeline (e.g., via KaTeX or MathJax SVG conversion). Key challenges include precise vector interpolation/morphing algorithms and temporal animation coordination. This demands advanced computer graphics, numerical geometry, and graphics pipeline engineering expertise.
Discussion
20 comments analyzed.
Competitors mentioned: Motion Canvas - TypeScript animation library with timeline editor, Traditional Manim - Python version with computational libraries, Canvas Commons - active fork of Motion Canvas, Zencoder - AI agent for code generation
Concerns raised: Text flickering issues across multiple examples, Fuzzy text rendering quality, 3D directional lighting not functioning, MathJax rendering limitations compared to Pango for complex equations, Browser performance with large animations vs traditional Manim
Feature requests: Export to GIF or MP4 directly in browser using MediaRecorder API, Python canvas backend for web instead of requiring TypeScript conversion, Fix 'Learn More' clickable links in documentation, Human-in-the-loop approach for issue resolution, Exact matching of Manim's easing curves and rate functions
Competitors
Other products that read as similar to this one — 212 launches clear the similarity bar, closest 8 shown.
Attention rank: #24 of 213 (itself plus its competitors, highest first — normalized so YC and Product Hunt are compared fairly).
Launched 119 days after the earliest competitor.
- Mathscene · ph · 2026-09-18 · 2 upvotes · similarity 0.73
- Manim (3Blue1Brown's animation engine) in the browser via WebGPU · hn · 2026-07-29 · 49 upvotes · similarity 0.73
- Zephyr3D · hn · 2025-11-26 · 9 upvotes · similarity 0.50
- I built a zero-browser, pure-JS typesetting engine for bit-perfect PDFs · hn · 2026-03-01 · 78 upvotes · similarity 0.48
- Mystral Native · hn · 2026-01-27 · 50 upvotes · similarity 0.47
- Quasicrystals Animation Playground with WebXR · hn · 2026-08-15 · 40 upvotes · similarity 0.45
- Tylax · hn · 2026-01-07 · 27 upvotes · similarity 0.44
- Coi · hn · 2026-01-20 · 225 upvotes · similarity 0.44
Other launches for this product
- No other launches for this product.
Same idea, different domain
Nobody's really built a dev tools tool for Sales yet.