Everybody loves the vintage game Pong, right? We sure do. What’s more fun? Building it yourself!
That’s why we decided to create one with SVG.js – to highlight some aspects of our library. It might seem like a complex idea …
Our own Sarah Drasner has published a book! You can grab it from the O’Reilly website or Amazon.
If you need a little convincing, I figured I would post the foreword I wrote for the book here, then you …
Say we wanted to continuously randomize the radius of a circle. We could kinda fake a random look with just CSS, but let’s go for full-on pseudo-random numbers created in JavaScript.
We’re talking SVG here, so here’s our base circle:…
It was brought up at the SVG Summit the other day, wouldn’t it be nice when working with SVG to be able to work with it both ways at once?
These aren’t particularly hard to web search for, but just in case you didn’t know they existed I figured I’d drop them here. I’ve used all three of these in the past and I think they do a good job …
A legit CSS trick documented by Eric Meyer!
So there is polygon() in CSS and <polygon></polygon> in SVG. They are closely related, but there are all kinds of weirdnesses. For example, you can use path() in CSS to update …
Let’s say you have a photographic image that really should be a JPG or WebP, for the best file size and quality. But what if I need transparency too? Don’t I need PNG for that? Won’t that make for either …
Over at Medium, Jon Moore recently identified "non-rectangular headers" as a tiny trend. A la: it's not crazy popular yet, but just you wait, kiddo.
We're talking about headers (or, more generally, any container element) that have a non-rectangular shape. Such as trapezoids, complex geometric shapes, rounded/elliptical, or even butt-cheek shaped.
Amelia Bellamy-Royds:
…I wondered if I could come up with an easy formula to create a “squircle” type curve with SVG bezier curves. It wouldn’t be the exact shape, but it could be close. The idea:
The “end points” of
The open web’s success is built on interoperable technologies. The ability to control animation now exists alongside important features such as zooming content, installing extensions, enabling high contrast display, loading custom stylesheets, or disabling JavaScript.
Sites all too often inundate …
