I’ve added a “spring mode” to my animated SVG desert. Flowers bloom, colours shift, and the whole scene feels more alive—all without creating a separate version. Instead, I’m layering changes on top of the same SVG and letting CSS and JavaScript do the work.
I designed a website for composer Begoña Pereda using typography and animated SVG graphics to reflect her personality and musical style. Here’s how I approached it.
I redesigned my contact page animation as a gold mine scene. Here’s how I approached the artwork, structured the SVG, and added subtle ambient animation using CSS.
Yours truly over at the Smashing Magazine: “SVGs, they scale, yes, but how else can you make them adapt even better to several screen sizes? Web design pioneer Andy Clarke explains how he builds what he calls “adaptive SVGs” using symbol, use, and CSS Media Queries.”
Emma Bodger is a film/television producer, and recently, I’ve spent time working on her visual identity and a new website. It’s been a lot of fun, and I also learned more about SVG while working on it. I’m digging into the details this week, and today I’ll explain how I made experimental banner images for Emma’s home page using SVG masks.
Emma Bodger is a film/television producer, and recently, I’ve spent time working on her visual identity and a new website. It’s been a lot of fun, and I also learned more about SVG while working on it. I’m digging into the details this week, and today I’ll explain how I made an experimental word search concept for Emma’s home page.
Emma Bodger is a film/television producer, and recently, I’ve spent time working on her visual identity and a new website. It’s been a lot of fun, and I also learned more about SVG while working on it. I’m digging into the details this week, and today I’ll explain the SVG filters I created to transform images on Emma’s website.
After writing yesterday’s blog entry on Re-coding Apple’s Black Friday dates I realised I had missed the bleedin’ obvious solution. That instead of wrangling CSS and HTML, SVG could’ve been the better option.
When I was developing the SVG panel for principles on the Stuff & Nonsense about page, I ran into a problem which could only be fixed using.
Given that SVG makes it possible to create cool compositions of images and text, I’m surprised I rarely see designers and developers using it for more than just icons.
I’m Andy Clarke. I’ve spent over thirty years helping businesses, charities, and organisations create memorable websites. I’m also the author of books on web design.