Set Type on a Circle… with offset-path
28.1.2020
Here's some legit CSS trickery from yuanchuan. There is this CSS property offset-path. Once upon a time, it was called motion-path and then it was renamed. I sort of rolled my eyes at the time, because the property is so obviously for animating things along a path. But you don't have to use it...
aviationstack
28.1.2020
(This is a sponsored post.)
I wonder how many startup ideas have something to do with air travel? 🤔
It's such a big industry with so many pain points its no wonder that it inspires ideas for building new products. Here's the thing about a lot of startup ideas: you need data. Chances...
How to Create Procedural Clouds Using Three.js Sprites
28.1.2020
Learn how to simulate a cloud on a Three.js Sprite using React-Three-Fiber.
How to Create Procedural Clouds Using Three.js Sprites was written by Robert Borghesi and published on Codrops
What does “revert” do in CSS?
28.1.2020
Miriam Suzanne has a Mozilla Developer video on the subject. The revert value is fairly new, supported in Firefox and Safari, but not yet in Chrome-world. We've already got a couple of related keywords that work on any property which are meant to help control inheritance and reset values....
Woodworking SVG (and Other Real Life Encounters)
27.1.2020
Eric Meyer does his woodworking math in SVG.
I’ve been hand-coding SVG schematics to figure out how thing should go together, and as a by-product, guide me in both material buying and wood cutting.
This might sound hugely bespoke and artisanally overdone, but they’re not that complicated, and...
Going Beyond Automatic SVG Compression With the “use” Element
27.1.2020
If you draw your own SVG files or if you download them from the internet, tools like this SVG-Editor or SVGOMG are your friends. Compressing the files with those tools takes only few seconds and reduces your file size a lot. But if you need to use your SVG inline to animate or interact with...
Simple Image Placeholders with SVG
27.1.2020
A little open-source utility from Tyler Sticka that returns a data URL of an SVG to use as an image placeholder as needed.
I like the idea of self-running utilities like that, rather than depending on some third-party service, like placekitten or whatever. Not that I'd advocate for feature...
Inspirational Websites Roundup #12
27.1.2020
Our first websites roundup of 2020 that showcases our favorite projects from the past few weeks.
Inspirational Websites Roundup #12 was written by Mary Lou and published on Codrops
Collective #584
27.1.2020
Today, the Trident Era Ends * Introducing Yarn 2 * Griddle * Some Imaginary CSS * Playwright
Collective #584 was written by Pedro Botelho and published on Codrops
“Browser Functions”
26.1.2020
Serverless functions are fairly straightforward. Put a bit of back-end language code, like Node, in the cloud and communicate with it via URL. But what if that URL didn't run a back-end language, it ran an actual browser? Richard Young:
We can now do full stack development using just Web APIs....
Flexible Captioned Slanted Images
25.1.2020
The end result of Eric Meyer's tutorial on creating this row of slanted images is pretty classy. But it's more about the journey than the destination (there isn't even really an isolated demo for it). Eric does an amazing job at talking it through like a thought process.
We did that recently, only...
UI Interactions & Animations Roundup #2
25.1.2020
Some selected shots of great UI interactions and animation for your inspiration.
UI Interactions & Animations Roundup #2 was written by Mary Lou and published on Codrops