Monky Business: Creating a Cistercian Numerals Generator
A developer creates a web tool and Node.js library to generate Cistercian numeral characters as SVG/PNG images, with code available on GitHub.
A developer creates a web tool and Node.js library to generate Cistercian numeral characters as SVG/PNG images, with code available on GitHub.
A humorous look at AI model benchmarking using the challenge of generating an SVG of a pelican riding a bicycle, and the risks of labs 'gaming' the test.
A comprehensive guide to understanding and using SVG path elements, covering commands, syntax, and animations.
A beginner-friendly introduction to SVG, covering basic shapes, inline usage, and how to animate them with CSS and JavaScript.
A developer's journey to create custom Open Graph images for their Astro blog using Puppeteer and SVG templates.
Learn how to use vite-plugin-svgr to import SVG files as React components in your Vite projects, replacing create-react-app functionality.
A technical tutorial explaining two methods (SVG animateMotion and CSS offset-path) to animate an object along a moving SVG path, with JavaScript control.
A developer's journey implementing dynamic Open Graph images for a blog using the Eleventy Image plugin and SVG.
A guide to creatively styling HTML <hr> elements with CSS and SVG, moving beyond plain lines to add visual flair while maintaining semantics.
A guide on using SVGR to convert SVG icons into React components, covering both manual CLI and automated Webpack methods.
A technical guide on using Eleventy's pagination feature to automatically generate Twitter card images (SVG) for blog posts.
A case study on implementing accessible data visualizations using SVG for the Khan Academy 2018 Annual Report website.
A developer's tool for converting SVG path commands between all-relative and all-absolute formats, with a focus on easier path manipulation.
A tutorial series explaining SVG filters, covering various filter primitives like feMorphology and feComponentTransfer for visual effects.
A critical look at the CSS pointer-events property, arguing against its use on standard HTML elements while acknowledging valid SVG use cases.
A guide to SVG filters, covering basics, practical applications, and resources from a talk by Sara Soueidan.
A technical guide on creating dynamic, scroll-responsive Bézier curves and swoopy shapes using SVG and React.
Using SVG's viewBox and preserveAspectRatio attributes to crop and scale images as a fallback or alternative to CSS object-fit.
A guide on implementing SVG patterns as backgrounds in React applications, including code examples and tool recommendations.
Explains how to simulate relative positioning for elements within an SVG by using nested SVGs, addressing the lack of a CSS box model.