Tyler’s CSS Wish List for 2023
Cloud Four’s creative director ponders what he’d like to see from CSS in the coming year.
SVG
So… you can set an SVG circle’s radius in CSS?
But I'm not sure when this became widely supported, and I can't find anything about it online...
Coding a Snowflake Generator
Hand-code an SVG snowflake, experiment in an interactive playground, and generate infinite random snowflakes with a dash of JavaScript.
Which SVG technique performs best for way too many icons?
When I started giving talks about SVG back in 2016, I'd occasionally hear a question I never had a great answer for: What if you have a lot of icons on a page?
Generating SVG Solar Systems, Part 2: Filters, Gradients, and Clip Paths
Turning simple shapes into complex illustrations using some SVG magic.
Generating SVG Solar Systems, Part 1: Setting the Scene
Using JavaScript, SVGs, and CSS to procedurally generate unique solar systems.
Simple Image Placeholders with SVG
We do a lot of rapid prototyping at Cloud Four, which means we’re often working with incomplete or hypothetical content. When it comes to FPO images, we’ve relied on a few different solutions: Third-party services…
Rasterizing SVG Animations
How I avoided relearning software (and gained some superpowers) by exporting my SVG and GSAP animations to bitmap sprites.
CSS Circles
I accidentally became Cloud Four's resident expert on dynamic circular containing elements. Here are my tips and tricks.
A Quick Update on Our SVG Icon Process
Our techniques evolve with each new project, and SVG icons are no exception!