Mandala-Maker

Draw a mandala right in your browser. Whatever you draw is repeated around the center and mirrored, so a few loose strokes become a symmetric design. Save it as a PNG or as an SVG. No sign-up and no libraries.

• Make a mandala

What it does

Press and drag on the drawing area with a mouse, a finger or a pen. Each stroke is repeated in every fold, and, if Mirror each fold is on, flipped inside each fold too, which is what gives a mandala its petal look.

• Folds: from 2 to 24 repeats around the center (12 by default).
• Brush: size and opacity, in a color you pick from a palette, or in rainbow rings that change color with the distance from the center, or in a color that cycles from stroke to stroke.
• Background: dark, light, midnight or black, and an optional guide overlay that shows the fold lines.
• Undo, redo and clear, and Surprise me for a random starting design.
• Save PNG (2048 pixels square) or Save SVG (vector, so it prints at any size). Both can have a transparent background.

Your strokes and settings are kept in the browser's local storage, so reloading the page picks up where you left off.

How it is built

The pages are plain HTML, CSS and JavaScript, with no dependencies and no build step. Just open index.html. It is also a small installable web app: add it to your home screen or desktop and it works offline.

• Strokes are stored in normalized coordinates, so the drawing stays the same when the window is resized.
• The canvas is redrawn from the stroke list, with an offscreen cache for speed. The SVG export writes each stroke once and repeats it with use elements.
• The app logic is in js/mandala.js.
• Three color themes (dark, light and blue) are shared with my other projects.

Mandala-Maker is open source at GitHub with MIT license.

Encourage this project by becoming a sponsor.

You may also be interested in my other projects Sacred-Geometry (demo), Platonic-Solids (demo) and Archimedean-Solids (demo).

Copyright (c) 2026 Olivier Giulieri.