The Minifier Benchmarks Project j9t )Oct 15, 2026 217 websites , minification , metrics , comparisons , html-minifier , htmlnano , minify-html , minimize , swc , html , css , javascript SVG “Linked Parameters” Will Change How We Do Icon Systems chr /fro )Oct 15, 2026 216 images , icons My Interop 2027 Rankings val )Oct 11, 2026 215 interoperability , web-platform , css , images , javascript , html , apis The Best Way to Use Icons in Web UIs lea )Oct 11, 2026 214 icons , images , css , style-queries , examples Updated Candidate Recommendation: Scalable Vector Graphics (SVG) 2 w3c )Oct 6, 2026 213 standards CSS Linked Parameters Module Level 1 tab +/w3c )Jul 14, 2026 212 css , images Which Copyleft Licence Is Suitable for an SVG? ede )Jun 20, 2026 211 images , licensing Build SVG Charts for Web Applications With Code Examples Jun 17, 2026 210 images , visualization , examples Dark Mode With Web Standards oll )Jun 12, 2026 209 dark-mode , standards , html , javascript , css Creating Memorable Web Experiences: A Modern CSS Toolkit hol /css )Jun 10, 2026 208 css , animations , user-experience Do Graphs and Charts Need to Be Accessible? tem )Apr 29, 2026 207 accessibility , png , images , aria , information-design SVG Filters Guide: Getting Started With the Basics ana /fro )Apr 9, 2026 206 guides , fundamentals , filters , images SVG Favicons That Respect Theme Preference paw )Mar 14, 2026 205 favicons , images , dark-mode Put “aria-hidden=true” on Decorative SVGs mat )Feb 27, 2026 204 images , aria , accessibility , attributes SVGs on the Web: Performance Comparison Based on How You Load Them nuc )Feb 24, 2026 203 images , performance , comparisons Loading Smarter: SVG vs. Raster Loaders in Modern Web Design hol /css )Feb 23, 2026 202 images , progress-indicators , performance Measuring SVG Rendering Time sto )Feb 5, 2026 201 png , images , rendering , performance , web-vitals , metrics SVG Filters Are Just Amazing ami )Jan 12, 2026 200 filters How to Create an Adaptive SVG Favicon Using the “prefers-color-scheme” Media Query zor /css )Nov 27, 2025 199 videos , how-tos , favicons , css , images Web Image Formats: JPEG vs. PNG vs. WebP vs. SVG Nov 21, 2025 198 images , jpeg , png , webp , comparisons Smashing Animations: Magnificent SVGs With “<use>” and CSS Custom Properties mal /sma )Nov 7, 2025 197 animations , transforms , css , custom-properties “pathLength” Makes Makes SVG Path Animations Easier to Manage ste )Nov 3, 2025 196 images , animations Smashing Animations: Building Adaptive SVGs With “<symbol>”, “<use>”, and CSS Media Queries mal /sma )Oct 6, 2025 195 animations , css , javascript Inset Shadows Directly on “img” Elements ana /fro )Oct 1, 2025 194 images , css , shadows Replace Your Animated GIFs With SVGs fro )Sep 15, 2025 193 gif , images , animations , css Liquid Glass in the Browser: Refraction With CSS and SVG Sep 4, 2025 192 effects , liquid-glass , css , images Implementing Accessible SVG Elements a11 )Jul 24, 2025 191 accessibility , images , fundamentals A Friendly Introduction to SVG jos )Jul 21, 2025 190 introductions , images I’m More Proud of These 128 Kilobytes Than Anything I’ve Built Since Jul 11, 2025 189 performance , case-studies , flash-of-x , minification , optimization Step Gradients With a Given Number of Steps ana /fro )Jun 30, 2025 188 gradients , css , sass , filters SVG Optimization and Accessibility Basics dbu )Jun 25, 2025 187 fundamentals , images , optimization , accessibility Decoding the SVG “path” Element: Curve and Arc Commands sma )Jun 23, 2025 186 javascript , css Grainy Gradients ana /fro )Jun 13, 2025 185 gradients , effects , css , masking Decoding the SVG “path” Element: Line Commands sma )Jun 9, 2025 184 Layered Text Headers chr /fro )Mar 24, 2025 183 typography , css , shadows A Deep Dive Into the Inline Background Overlap Problem ana /fro )Mar 18, 2025 182 deep-dives , css , filters , backgrounds Super Crispy SVG Icons ale )Mar 5, 2025 181 images , icons , optimization Using SVGs on Canvas With Compose Multiplatform eev )Jan 15, 2025 180 canvas , images , javascript Stylish Holidays! Creating a Scroll-Driven Christmas Tree in CSS uti )Dec 17, 2024 179 css , animations , scrolling , effects Page by Page: How Pagination Makes the Web Accessible mat )Dec 14, 2024 178 accessibility , pagination , html , css Mastering SVG Arcs sma )Dec 9, 2024 177 images How to Use CSS and SVG Clipping and Masking Techniques wpe )Oct 2, 2024 176 how-tos , css , images , clipping , masking SVG Coding Examples: Useful Recipes for Writing Vectors by Hand sma )Sep 18, 2024 175 images , examples Line Numbers for “<textarea>” Using SVG sto )Aug 19, 2024 174 forms , javascript Have It All: External, Styleable, and Scalable SVG sco )Jul 29, 2024 173 images , css “Practical SVG” Is Now Free to Read Online chr )Jul 22, 2024 172 books , images Minimal SVG Favicon sto )Jun 15, 2024 171 images , favicons , minimalism Ditch the Pixels: The Small and Vectorized Web yor )Jun 6, 2024 170 html , images Accessible SVG Forms May 13, 2024 169 accessibility , forms , aria Morphing Arbitrary Paths in SVG May 13, 2024 168 animations The HTML, CSS, and SVG for a Classic Search Form chr /fro )Apr 25, 2024 167 search , forms , html , css Dynamic Text Color Contrast Based on Background Lightness With CSS/SVG Filters miu )Feb 11, 2024 166 css , filters , colors , contrast Everything You Need to Know About Image Formats in 2024 web )Feb 9, 2024 165 images , jpeg , png , gif , webp , avif , pdf Making Your SVG Icons CSS Masks Instead of Inline HTML or Backgrounds Has Some Benefits chr /fro )Feb 2, 2024 164 images , css , masking , performance What Is CSS Motion Path? Jan 21, 2024 163 css , animations Responsive SVGs nil /5t3 )Dec 23, 2023 162 images , responsive-design Create Dynamic Web Experiences With Interactive SVG Animations Dec 1, 2023 161 images , animations , tooling An Introduction to Working With SVGs in React Oct 28, 2023 160 introductions , images , react Changing Colors in an SVG Element Using CSS and JavaScript Oct 23, 2023 159 colors , css , javascript Let’s Make a Rubber Button With HTML, CSS, and SVG tyl /clo )Aug 30, 2023 158 buttons , html , css , images Please Size Your Inline SVGs aar )Aug 21, 2023 157 images SVG Gradients: Solving Curved Challenges Jul 24, 2023 156 images , gradients Creating SVG Animations Using Tailwind CSS Jul 5, 2023 155 images , animations , tailwind Understanding SVG Paths Jul 3, 2023 154 images That Time When SVG Almost Got Network Support for Raw Sockets Mar 21, 2023 153 network , history Unlocking SVG’s Superpowers cas /btc )Mar 1, 2023 152 videos , images Building an Animated SVG Logo With animejs Feb 16, 2023 151 images , logos , animations , vuejs Learn Images wil )Feb 1, 2023 150 courses , images , gif , png , jpeg , webp , avif Easy SVG Customization and Animation: A Practical Guide cod /sma )Jan 30, 2023 149 guides , images , animations Creating a Custom Cursor Using CSS css )Jan 24, 2023 148 cursors , css , images 6 Common SVG Fails (and How to Fix Them) css )Jan 17, 2023 147 images Interactive SVG Reference Jan 15, 2023 146 images Invisible Ink Effect With SVG Filters and CSS che )Dec 24, 2022 145 code-pens , css , filters , effects What I Learned About SVG Accessibility (Among Other Things) From NBC News’ Senate “What If” Project Oct 13, 2022 144 accessibility , images , lessons SVG Sprites: Old-School, Modern, Unknown, and Forgotten pep )Oct 10, 2022 143 images , sprites , performance How to Scale SVG ame /css )Sep 30, 2022 142 how-tos , scaling , images Dreamy Blur Sep 5, 2022 141 css , effects 8 Tricks for SVG Optimization Aug 23, 2022 140 images , tips-and-tricks , optimization Vector Animations With Figma and SVG Animate Jul 21, 2022 139 animations , figma , images Can SVG Symbols Affect Web Performance? Jul 17, 2022 138 images , performance How to Animate SVG Shapes on Scroll cod )Jun 8, 2022 137 how-tos , css , animations Magical SVG Techniques sma )May 10, 2022 136 images , techniques Optimizing SVG Patterns to Their Smallest Size css )Mar 18, 2022 135 images , performance Using “mask” as “clip-path” Feb 18, 2022 134 css , masking Creating Generative SVG Grids tro )Feb 7, 2022 133 javascript , grids Building UI Components With SVG and CSS sha )Jan 18, 2022 132 components , css The Many Methods for Using SVG Icons hui )Dec 23, 2021 131 css , images , icons Wrapping Text Inside an SVG Using CSS jay )Dec 22, 2021 130 css Fractional SVG Stars With CSS Sep 7, 2021 129 css , images Using SVG With Media Queries web )Aug 31, 2021 128 css , media-queries Thinking About the Cut-Out Effect: CSS or SVG? sha )Jul 27, 2021 127 css , techniques , effects , comparisons OMG, SVG Favicons FTW! Jun 17, 2021 126 html , images , favicons Adding Shadows to SVG Icons With CSS and SVG Filters css )Jun 11, 2021 125 css , images , icons , shadows , filters , effects Accessible SVGs: Perfect Patterns for Screen Reader Users car /sma )May 26, 2021 124 accessibility , images , screen-readers How to Use SVG Image Sprites cra )Mar 10, 2021 123 how-tos , images , sprites Creating a Custom Cursor Using CSS? Sep 11, 2020 122 css , images , cursors AVIF Has Landed jaf )Sep 8, 2020 121 images , avif , performance , quality , jpeg , webp , png , comparisons SVG Title vs. HTML Title Attribute chr /css )Jul 30, 2020 120 html , attributes SVG, Favicons, and All the Fun Things We Can Do With Them eri /css )Apr 24, 2020 119 images , favicons , dark-mode Tools for Optimizing SVG chr /css )Mar 17, 2020 118 tooling , images , optimization , link-lists Accessible SVGs: Inclusiveness Beyond Patterns car /sma )Mar 12, 2020 117 images , accessibility , tooling How We Learned to Draw Text on HTML5 Canvas Feb 19, 2020 116 html , canvas , apis , javascript When to Use SVG vs. When to Use Canvas chr /css )Nov 12, 2019 115 canvas , comparisons SVG Properties in CSS Guide kat /css )May 13, 2019 114 guides , css A Practical Guide to SVG and Design Tools sma )May 3, 2019 113 guides , images , sketch , figma , adobe , tooling , design SVG Circle Decomposition to Paths sma )Mar 22, 2019 112 images , animations Icon Fonts vs. SVGs—Which One Should You Use in 2018? Aug 9, 2018 111 fonts , icon-fonts , images What Is SVG Good For? chr /css )Jun 20, 2018 110 images , examples A Pretty Good SVG Icon System chr /css )Jun 23, 2017 109 icons , images Masking vs. Clipping: When to Use Each sar /css )Jun 7, 2017 108 masking , clipping , images , comparisons An Introduction to CSS Filters May 9, 2017 107 introductions , css , filters GIF, PNG, JPG, or SVG: Which One to Use? May 2, 2017 106 images , jpeg , png , gif , webp , comparisons What Is the Right Image Format for Your Website? Apr 5, 2017 105 images , compression , jpeg , gif , png , webp Align SVG Icons to Text and Say Goodbye to Font Icons pro )Jan 18, 2017 104 images , icons , icon-fonts , fonts , css , design , alignment Know It All Jan 8, 2017 103 websites , css , html , dom , javascript , cssom , nodejs A Compendium of SVG Information chr /css )Jan 7, 2017 102 overviews , images , link-lists Presentation Attributes vs. Inline Styles chr /css )Dec 23, 2016 101 html , attributes , css , comparisons Random Interesting Facts on HTML/SVG Usage cat /css )Nov 25, 2016 100 html , metrics , amp , accessibility SVG Filter Primitives—Input and Output Oct 11, 2016 99 images , filters SVG and Media Queries jaf )Oct 10, 2016 98 images , css , media-queries , canvas , support , browsers The SVG “path” Syntax: An Illustrated Guide chr /css )Oct 3, 2016 97 guides , images WordPress SVG Support: How to Enable SVGs in WordPress Sep 29, 2016 96 how-tos , wordpress , images An Introduction to SVG Filters Sep 27, 2016 95 introductions , images , filters Accessible SVGs in High Contrast Mode eri /css )Sep 22, 2016 94 accessibility , images , contrast , colors Accessible SVGs css )Aug 28, 2016 93 images , accessibility , examples Practical SVG chr /ali )Aug 9, 2016 92 images High Performance SVGs sar /css )Aug 1, 2016 91 images , performance , tooling , optimization Generating SVG With React sma )Dec 28, 2015 90 react , javascript A Guide for SVG Support in Email geo /css )Dec 22, 2015 89 guides , images , support , email SMIL Is Dead! Long Live SMIL! A Guide to Alternatives to SMIL Features sar /css )Dec 14, 2015 88 guides , smil , images , animations Creating Alpha Channel JPEGs Using SVG zol )Nov 7, 2015 87 images , jpeg , transparency+opacity Background Image Shapes css )Oct 30, 2015 86 backgrounds , images , shapes , css , transforms , clipping How to Make Charts With SVG fon /css )Oct 5, 2015 85 how-tos , visualization , images , html , javascript Creating Cel Animations With SVG hey /sma )Sep 14, 2015 84 animations , images , css , sass SVG Is for Everybody chr /btc )Aug 31, 2015 83 videos , images SVG Lessons I Learned the Hard Way sar /btc )Aug 31, 2015 82 videos , images , lessons The Art of SVG Filters and Why It Is Awesome sma )May 26, 2015 81 images , filters , css SVG Fallbacks Guide ame /css )May 4, 2015 80 guides , images , graceful-degradation Using AngularJS for Data Visualisations css )Feb 25, 2015 79 angularjs , visualization Progressive Enhancement and Data Visualizations css )Feb 2, 2015 78 progressive-enhancement , html , css , visualization SVG Animation and CSS Transforms: A Complicated Love Story css )Nov 10, 2014 77 css , animations , transforms How SVG Fragment Identifiers Work chr /css )Nov 3, 2014 76 images , css Styling and Animating SVGs With CSS sar /sma )Nov 3, 2014 75 images , css , animations Probably Don’t Base64 SVG chr /css )Oct 21, 2014 74 images , data-urls , base64 A Guide to SVG Animations (SMIL) sar /css )Oct 13, 2014 73 guides , images , animations , smil Making SVGs Responsive With CSS sar /cod )Aug 19, 2014 72 images , responsive-design , css Swapping Out SVG Icons chr /css )Aug 12, 2014 71 images , icons , css , jquery , techniques Responsive Web Design, CSS Specificity, and SVG Knowledge Aug 1, 2014 70 responsive-design , sublime-text , css , javascript Tips for Creating Accessible SVG tin )May 6, 2014 69 accessibility , images , tips-and-tricks Shadow DOM Mar 14, 2014 68 shadow-dom , dom , images , angularjs , css , mathml Rethinking Responsive SVG sma )Mar 5, 2014 67 responsive-design , images , css Animating Vectors With SVG bri /24w )Dec 7, 2013 66 images , animations , javascript SVG Fallbacks chr /css )Aug 19, 2013 65 images , support , browsers , png SVG Filters on Text css )Aug 9, 2013 64 images , filters , effects Solving Rendering Performance Puzzles jaf )Aug 5, 2013 63 javascript , performance , rendering How to Create SVG Paths Easily Using the GIMP zol )Apr 26, 2013 62 how-tos , images Media Queries Within SVG tka )Apr 11, 2013 61 images , css , media-queries , support , browsers Media Queries in SVG Images gri /clo )Apr 3, 2013 60 images , css , media-queries Using SVG chr /css )Mar 5, 2013 59 images , css , support , browsers , examples , data-urls , tooling , link-lists CSS Masks—How to Use Masking in CSS Now sch )Dec 20, 2012 58 how-tos , css , masking , images Better SVG Sprites With Fragment Identifiers sto )Aug 14, 2012 57 images , sprites Resolution Independence With SVG dbu /sma )Jan 16, 2012 56 images , css , responsive-design A Farewell to CSS3 Gradients mis )Sep 14, 2011 55 css , gradients , vendor-extensions , images Google Now Indexes SVG jsa )Sep 1, 2010 54 google , search , images Firefox 4: The HTML5 Parser—Inline SVG, Speed, and More hsi /moz )May 11, 2010 53 html , parsing , gecko , firefox , browsers SVG Wow Feb 7, 2010 52 websites , images , examples Microsoft Joins SVG Working Group tho /osn )Jan 6, 2010 51 microsoft , standards , w3c W3C Cheatsheet don /w3c )Nov 4, 2009 50 cheat-sheets , documentation , css , html , xpath , accessibility , internationalization , typography “toDataURL,” Canvas, and SVG bra /aja )Oct 5, 2009 49 javascript , apis , canvas , images Google to Microsoft: Support SVG inf )Oct 2, 2009 48 google , microsoft , browsers , internet-explorer , standards , support Why IE9 Will Support SVG fyr )Jul 31, 2009 47 internet-explorer , browsers , images , support SVG Is the Future of Application Development Dec 22, 2008 46 images , web-apps , outlooks SVG Test Page fyr )Dec 10, 2008 45 images , testing SVG Filter Performance Improvements in Gecko 1.9.1 Jul 23, 2008 44 gecko , browser-engines , browsers , images , filters SVG Paint Servers for HTML Jul 8, 2008 43 html , css , images , backgrounds State of AJAX for June 2008: Apple Flexes Open Web Muscles dal /aja )Jul 1, 2008 42 browsers , standards , performance , javascript , extjs , dojo , yui , mootools , jquery , css , canvas , tooling , link-lists , ajaxian Rendering Performance in Canvas Compared to SVG and VML dal /aja )Jun 24, 2008 41 performance , rendering , canvas , images , comparisons HTML5: The Foreign Lands (Mathematics and Graphics) ann )Apr 6, 2008 40 html , mathml , standards SVG on Acid? ada /w3c )Jan 21, 2008 39 acid-tests , standards Web Standards, the Real Flash Killer fyr )Nov 16, 2007 38 standards , html , canvas , multimedia , flash SVG and “text/html” ann )Oct 17, 2007 37 images , mime-types , html , parsing Color Sampling and SVG Gradients bur )Oct 8, 2007 36 colors , images , gradients SVG Video Demo Oct 1, 2007 35 multimedia , silverlight Tim Berners-Lee and Reinventing HTML Oct 29, 2006 34 html , standards , w3c , whatwg Wherefore Art Thou, SVG? Sep 10, 2006 33 w3c , standards More W3C Controversy dba )Aug 18, 2006 32 w3c , standards , interoperability Vector Graphics in CSS ann )Jan 22, 2006 31 css , images , xhtml W3C May Push Wireless Web Specs cne )Nov 17, 2004 30 w3c , mobile , xhtml , smil , standards SVG and Typography Apr 7, 2004 29 typography SVG Developers, Start Your Engines Oct 8, 2003 28 w3c Graphics Standard Fit to Print Oct 2, 2003 27 print , standards An SVG Case Study: Integrated, Dynamic Avalanche Forecasting Apr 23, 2003 26 perl , html , sql , databases , images , case-studies Graphics Standard Heads to Print cne )Feb 20, 2003 25 w3c , standards , images , print SVG’s Past and Promising Future Dec 4, 2002 24 standards , outlooks Content Negotiation in Heterogenous XML Environments Nov 8, 2002 23 content-negotiation , mime-types , xml , xhtml , rdf , mathml Recommended Doctype Declarations to Use in Your Web Document kar /w3c )Apr 8, 2002 22 html , xhtml , mathml , doctypes SVG: Modularized and Mobile Mar 6, 2002 21 images , html , animations SWF vs. SVG—Which Should You Choose? Mar 4, 2002 20 flash , images , comparisons A Milestone for SVG Aug 4, 2000 19 images , w3c A New Face for the Web zdn )Jun 5, 2000 18 images , flash SVG Validator 17 tools , analysis , conformance SVG and CSS Gradient Generator 16 tools , exploration , code-generation , css , gradients Code Converter 15 tools , exploration , conversion , html , css , json , json-ld , javascript , typescript , graphql Raster Image to SVG Converter tom )14 tools , exploration , conversion , images Icon Font, SVG, PDF, and PNG Generator 13 tools , exploration , images , code-generation , fonts , icon-fonts , pdf , png Image Compressor (Compressor.io) 12 tools , exploration , images , compression , performance , jpeg , png , gif , webp SVG Editor 11 tools , exploration , images SVG Optimizer (Daryll Doyle) 10 tools , exploration , images , optimization SVG Optimizer (Jake Archibald) jaf )9 tools , exploration , images , optimization SVG Shape Generator 8 tools , exploration , images SVG URL Encoder 7 tools , exploration , images , urls , code-generation Wave-Style SVG Generator 6 tools , exploration , images , effects , code-generation JPEG to SVG Converter 5 tools , exploration , conversion , images , jpeg SVG to Data URI Converter 4 tools , exploration , conversion , data-urls Confetti Generator 3 tools , exploration , images , png , jpeg , code-generation , css Image Converter (Canva) 2 tools , exploration , conversion , images , jpeg , png , pdf Background Pattern Generator (Neatbo) 1 tools , exploration , images , backgrounds , code-generation , css 