What to put in a prompt so the output is editable geometry rather than a picture of it: naming the style, bounding the path count, and stating the background.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 2 min read
Journal
Notes on drawing with coordinates.
Tutorials and reference material on vector geometry, tracing, and keeping SVG files small enough to read in a diff.
The viewport is the space on the page, the viewBox is the window onto the drawing. How the four numbers pan and zoom, what preserveAspectRatio decides, and the six ways scaling goes wrong.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 6 min read
Linear and radial gradients in SVG: where the stops go, how userSpaceOnUse differs from objectBoundingBox, and why the definition belongs in defs.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 1 min read
Styling & motion
How to Animate an SVG with CSS, SMIL and JavaScript
Animate SVG the three ways the browser supports: CSS keyframes, SMIL elements inside the file, and the Web Animations API. Includes the draw-on effect, the transform-box trap, and what each property costs to render.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 5 min read
Why icons blur on some screens and not others: whole-number anchors on a 24px grid, one stroke weight across a set, and alignment that survives scaling.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 1 min read
How classic image tracing works — colour quantisation, edge detection and bezier fitting with Potrace — and where an edge tracer beats a redraw.
- Author
- SVG Maker AI
- Published
- June 22, 2026
- Reading time
- 2 min read
Styling & motion
Styling Vectors with SVG Filters: Shadows, Blurs, and Glows
feGaussianBlur, feDropShadow and the filter primitives worth knowing, plus why filters render differently across engines and what that costs you.
- Author
- SVG Maker AI
- Published
- June 22, 2026
- Reading time
- 1 min read
Styling & motion
Advanced Vector Masking: ClipPaths, Masks, and Composition
clipPath cuts with a hard edge; mask fades with luminance. Which to reach for, how they compose, and the cases where both are the wrong answer.
- Author
- SVG Maker AI
- Published
- June 22, 2026
- Reading time
- 1 min read
Styling & motion
How to Style SVG with CSS: fill, currentColor and Theming
Why a CSS rule beats a fill attribute, what currentColor and custom properties each solve, how to reach into <use> content, and the mask trick for SVG used as a background image.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 5 min read
Decorative, informative or interactive — the three cases need different markup. role=img and title, when aria-labelledby is required, why icons in buttons should be silent, and contrast rules for graphics.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 5 min read
Live text, outlines, or an embedded font — what each costs. Why an @import inside an SVG fails as an image, how counters break when letters are split, and what outlining takes away.
- Author
- SVG Maker AI
- Published
- June 24, 2026
- Reading time
- 5 min read
Smaller files and cheaper rendering are two different problems. Delivery method, precision limits, server compression, and why node count — not bytes — is what makes a page stutter.
- Author
- SVG Maker AI
- Published
- June 19, 2026
- Reading time
- 6 min read