metafizzy/zdog

Zdog is a JavaScript library that lets you create simple 3D-looking graphics on a web page without the complexity of a full 3D engine. It works inside standard HTML elements, either a canvas element or an SVG element, and draws everything using flat 2D shapes. Spheres look like circles, tubes look like thick lines, and the depth effect comes from how those shapes are layered and rotated. The result is a clean, cartoon-like visual style rather than realistic 3D. The author built it because existing 3D engines were too large and complicated for the kinds of small interactive models he wanted to make. Zdog takes inspiration from a 1995 virtual pet game that used flat 2D circle sprites to fake a convincing 3D dog in real time, even on very old hardware. The same trick works here: simple shapes, smart math, no heavy rendering pipeline. To use it, you drop a script tag into your HTML page, then write a few lines of JavaScript to define shapes and attach them to a canvas or SVG element. You can build compositions from circles, rectangles, boxes, cones, cylinders, and other shapes, then animate them or let users drag to rotate them in 3D. The code example in the README shows how to create a spinning circle and square in under 30 lines. Installation is straightforward: link to the hosted file via a CDN, or install via npm. There are community-made plugins for text rendering and for Vue, plus a Python port. The project is in beta and the author expects significant changes in future versions. It is MIT licensed and best suited for decorative, illustrative, or playful web graphics rather than games or data visualization.