{ "diameter": 200,
"radius": 100 }{ "diameter": 200,
"radius": 100 }A circle geometry tool with an AI agent built in
Canvas rendering, live geometry computation, export, and natural-language control via Claude. Fork it and build on it.
What's in the box
HTML5 Canvas with HiDPI support, configurable dot grid, circle and chord drawing with labeled measurements. Redraws on resize.
Computes circumference, area, chord distance from center, sagitta, central angle, arc length, sector area, and segment area in real time.
Claude Opus 4.5 via Vercel AI Gateway. Natural language control of the canvas through tool calling. Ask it to draw, resize, or remove shapes.
Four client-side tools (setCircle, setLine, removeCircle, removeLine) wired via AI SDK 6. The LLM reads current geometry state and acts on it.
Adjust chord length and rotation angle with real-time sliders. Values sync between inputs, sliders, and AI commands.
Download as JPG (configurable quality and background color) or PNG (with transparency). Scale from 1x to 4x. Toggle grid and labels.
Copy all computed geometry as JSON or CSV with a preview modal. One-click clipboard copy.
Chat sidebar slides in from the left without squeezing the canvas. Right sidebar stacks below on mobile. ResizeObserver keeps the canvas sharp.
Full light/dark theme via CSS custom properties. All colors, radii, and sidebar tokens are configurable in globals.css.