Animated SVG Preloaders
Animated SVG Backgrounds
How to make animated loading graphics with only SVG
We’re going to create animated preloaders with SVG and nothing else. No CSS or JS is required. Once you know the basics, it’s easy to make variations.
SVG basics: Styling shape elements
We will breakdown a few foundational attributes you can use to change the appearance of SVG shape elements: fill, stroke, and opacity.
Is SMIL dead in 2022? Nope
Fast-forward to 2022 and the only browsers that don’t support SMIL are Internet Explorer (officially retired) and Opera Mini. Does that mean SMIL is alive?
CSS can’t animate gradients, but SVG can
Want to animate gradients for your website, but sad that CSS can’t help? Well it’s time to learn about SVG gradients and how to animate them.
How to add SVG backgrounds to HTML
We are going to learn how to add an SVG background into HTML as an inline SVG. This method allows us to manipulate the SVG via CSS or JS.