| Stylish Holidays! Creating a Scroll-Driven Christmas Tree in CSS (by) | | 110 |
| css, animations, scrolling, effects |
| Page by Page: How Pagination Makes the Web Accessible (via) | | 109 |
| accessibility, pagination, html, css |
| Mastering SVG Arcs (via) | | 108 |
| images |
| How to Use CSS and SVG Clipping and Masking Techniques (via) | | 107 |
| how-tos, css, images, masking |
| SVG Coding Examples: Useful Recipes for Writing Vectors by Hand (via) | | 106 |
| images, examples |
| Line Numbers for “<textarea>” Using SVG (by) | | 105 |
| forms, javascript |
| Have It All: External, Styleable, and Scalable SVG (by) | | 104 |
| images, css |
| “Practical SVG” Is Now Free to Read Online (by) | | 103 |
| books, images |
| Minimal SVG Favicon (by) | | 102 |
| images, favicons, minimalism |
| Ditch the Pixels: The Small and Vectorized Web (by) | | 101 |
| html, images |
| Morphing Arbitrary Paths in SVG (by) | | 100 |
| animations |
| Accessible SVG Forms (by) | | 99 |
| accessibility, forms, aria |
| The HTML, CSS, and SVG for a Classic Search Form (by/via) | | 98 |
| search, forms, html, css |
| Dynamic Text Color Contrast Based on Background Lightness With CSS/SVG Filters (by) | | 97 |
| css, filters, colors, contrast |
| Everything You Need to Know About Image Formats in 2024 (via) | | 96 |
| images, jpeg, png, gif, webp, avif, pdf |
| Making Your SVG Icons CSS Masks Instead of Inline HTML or Backgrounds Has Some Benefits (by/via) | | 95 |
| images, css, masking, performance |
| What Is CSS Motion Path? (by) | | 94 |
| css, animations |
| Responsive SVGs (by/via) | | 93 |
| images, responsive-design |
| Create Dynamic Web Experiences With Interactive SVG Animations (via) | | 92 |
| images, animations, tooling |
| An Introduction to Working With SVGs in React (via) | | 91 |
| introductions, images, react |
| Changing Colors in an SVG Element Using CSS and JavaScript (by) | | 90 |
| colors, css, javascript |
| Let’s Make a Rubber Button With HTML, CSS and SVG (by/via) | | 89 |
| buttons, html, css, images |
| Please Size Your Inline SVGs (by) | | 88 |
| images |
| SVG Gradients: Solving Curved Challenges (via) | | 87 |
| images, gradients |
| Creating SVG Animations Using Tailwind CSS (by+/via) | | 86 |
| images, animations, tailwind |
| Understanding SVG Paths (by) | | 85 |
| images |
| That Time When SVG Almost Got Network Support for Raw Sockets | | 84 |
| network, history |
| Unlocking SVG’s Superpowers (by/via) | | 83 |
| videos, images |
| Building an Animated SVG Logo With animejs (by/via) | | 82 |
| images, logos, animations, vuejs |
| Learn Images (by/via) | | 81 |
| courses, images, gif, png, jpeg, webp, avif |
| Easy SVG Customization and Animation: A Practical Guide (by/via) | | 80 |
| guides, images, animations |
| Creating a Custom Cursor Using CSS (by/via) | | 79 |
| cursors, css, images |
| 6 Common SVG Fails (and How to Fix Them) (by/via) | | 78 |
| images |
| Interactive SVG Reference (by) | | 77 |
| images |
| Invisible Ink Effect With SVG Filters and CSS (by) | | 76 |
| code-pens, css, filters, effects |
| What I Learned About SVG Accessibility (Among Other Things) From NBC News’ Senate “What If” Project (by) | | 75 |
| accessibility, images, lessons |
| SVG Sprites: Old-School, Modern, Unknown, and Forgotten (by) | | 74 |
| images, sprites, performance |
| How to Scale SVG (by/via) | | 73 |
| how-tos, images |
| Dreamy Blur (by) | | 72 |
| css, effects |
| 8 Tricks for SVG Optimization (by/via) | | 71 |
| images, tips-and-tricks, optimization |
| Vector Animations With Figma and SVG Animate (by/via) | | 70 |
| animations, figma, images |
| Can SVG Symbols Affect Web Performance? (by) | | 69 |
| images, performance |
| How to Animate SVG Shapes on Scroll (by/via) | | 68 |
| how-tos, css, animations |
| Magical SVG Techniques (via) | | 67 |
| images, techniques |
| Optimizing SVG Patterns to Their Smallest Size (by/via) | | 66 |
| images, performance |
| Using “mask” as “clip-path” (by) | | 65 |
| css, masking |
| Creating Generative SVG Grids (by/via) | | 64 |
| javascript, grids |
| Building UI Components With SVG and CSS (by) | | 63 |
| components, css |
| The Many Methods for Using SVG Icons (by) | | 62 |
| css, images, icons |
| Wrapping Text Inside an SVG Using CSS (by) | | 61 |
| css |
| Fractional SVG Stars With CSS (by) | | 60 |
| css, images |
| Using SVG With Media Queries (by/via) | | 59 |
| css, media-queries |
| Thinking About the Cut-Out Effect: CSS or SVG? (by) | | 58 |
| css, techniques, effects, comparisons |
| OMG, SVG Favicons FTW! (by) | | 57 |
| html, images, favicons |
| Adding Shadows to SVG Icons With CSS and SVG Filters (by/via) | | 56 |
| css, images, icons, shadows, filters, effects |
| How to Use SVG Image Sprites (by/via) | | 55 |
| how-tos, images, sprites |
| Creating a Custom Cursor Using CSS? (by) | | 54 |
| css, images, cursors |
| Accessible SVGs: Inclusiveness Beyond Patterns (by/via) | | 53 |
| images, accessibility, tooling |
| How We Learned to Draw Text on HTML5 Canvas (via) | | 52 |
| html, canvas, apis, javascript |
| A Practical Guide to SVG and Design Tools (by/via) | | 51 |
| guides, images, sketch, figma, adobe, tooling, design |
| SVG Circle Decomposition to Paths (via) | | 50 |
| images, animations |
| Icon Fonts vs. SVGs—Which One Should You Use in 2018? (via) | | 49 |
| fonts, icon-fonts, images |
| GIF, PNG, JPG, or SVG: Which One to Use? (via) | | 48 |
| images, jpeg, png, gif, webp, comparisons |
| What Is the Right Image Format for Your Website? (by/via) | | 47 |
| images, compression, jpeg, gif, png, webp |
| Align SVG Icons to Text and Say Goodbye to Font Icons (by/via) | | 46 |
| images, icons, icon-fonts, fonts, css, design, alignment |
| Know It All (by) | | 45 |
| websites, css, html, dom, javascript, cssom, nodejs |
| A Compendium of SVG Information (by/via) | | 44 |
| overviews, images, link-lists |
| Random Interesting Facts on HTML/SVG Usage (by/via) | | 43 |
| html, metrics, amp, google |
| WordPress SVG Support: How to Enable SVGs in WordPress (by/via) | | 42 |
| how-tos, wordpress, images |
| Accessible SVGs (by/via) | | 41 |
| images, accessibility, examples |
| Practical SVG (by/via) | | 40 |
| images |
| Generating SVG With React (by/via) | | 39 |
| react, javascript |
| Creating Cel Animations With SVG (by/via) | | 38 |
| animations, images, css, sass |
| SVG Lessons I Learned the Hard Way (by/via) | | 37 |
| videos, images, lessons |
| SVG Is for Everybody (by/via) | | 36 |
| videos, images |
| Styling and Animating SVGs With CSS (by/via) | | 35 |
| images, css, animations |
| Making SVGs Responsive With CSS (by/via) | | 34 |
| images, responsive-design, css |
| Responsive Web Design, CSS Specificity, and SVG Knowledge (by/via) | | 33 |
| responsive-design, sublime-text, css, javascript |
| Tips for Creating Accessible SVG (by/via) | | 32 |
| accessibility, images, tips-and-tricks |
| Rethinking Responsive SVG (by/via) | | 31 |
| responsive-design, images, css |
| Animating Vectors With SVG (by/via) | | 30 |
| images, animations, javascript |
| Media Queries in SVG Images (by/via) | | 29 |
| images, css, media-queries |
| Resolution Independence With SVG (by/via) | | 28 |
| images, css, responsive-design |
| A Farewell to CSS3 Gradients (by/via) | | 27 |
| css, gradients, vendor-extensions, images |
| SVG Is the Future of Application Development (via) | | 26 |
| images, web-apps, visions |
| W3C May Push Wireless Web Specs (via) | | 25 |
| w3c, mobile, xhtml, standards |
| SVG Developers, Start Your Engines | | 24 |
| w3c |
| Graphics Standard Fit to Print | | 23 |
| print, standards |
| An SVG Case Study: Integrated, Dynamic Avalanche Forecasting | | 22 |
| perl, html, sql, databases, images, case-studies |
| Graphics Standard Heads to Print (via) | | 21 |
| w3c, standards, images, print |
| SVG’s Past and Promising Future | | 20 |
| standards, visions |
| Content Negotiation in Heterogenous XML Environments (by) | | 19 |
| content-negotiation, mime-types, xml, xhtml, rdf, mathml |
| Recommended Doctype Declarations to Use in Your Web Document (by/via) | | 18 |
| html, xhtml, mathml |
| SVG: Modularized and Mobile | | 17 |
| images, html, animations |
| SWF vs. SVG—Which Should You Choose? (via) | | 16 |
| flash, images, comparisons |
| A Milestone for SVG | | 15 |
| images, w3c |
| A New Face for the Web (via) | | 14 |
| images, flash |
| Confetti Generator (via) | | 13 |
| tools, exploration, images, png, jpeg, code-generation, css |
| SVG to Data URI Converter (via) | | 12 |
| tools, exploration, conversion |
| JPEG to SVG Converter (via) | | 11 |
| tools, exploration, conversion, images, jpeg |
| Wave-Style SVG Generator (via) | | 10 |
| tools, exploration, images, effects, code-generation |
| SVG URL Encoder (by) | | 9 |
| tools, exploration, images, urls, code-generation |
| SVG Shape Generator (by) | | 8 |
| tools, exploration, images |
| SVG Optimizer (Jake Archibald) (by) | | 7 |
| tools, exploration, images, optimization |
| SVG Optimizer (Daryll Doyle) (by) | | 6 |
| tools, exploration, images, optimization |
| SVG Editor (by) | | 5 |
| tools, exploration, images |
| Icon Font, SVG, PDF, and PNG Generator | | 4 |
| tools, exploration, images, code-generation, fonts, icon-fonts, pdf, png |
| Raster Image to SVG Converter (by/via) | | 3 |
| tools, exploration, conversion, images |
| SVG and CSS Gradient Generator | | 2 |
| tools, exploration, code-generation, css, gradients |
| SVG Validator (by) | | 1 |
| tools, analysis, conformance |
