Morphing Arbitrary Paths in SVG

By Chris Coyier on

Shape morphing animations can be awfully cool. They can be artistic and elaborate like the waving cape of a brand character, or simple and understated like video player controls morphing from one state to another. Alexandru-Gabriel Ică digs into doing this in <svg>. There is a fairly big prerequisite to these kind of animations: the […]

Engineering for Slow Internet

By Chris Coyier on

Not everybody has smokin’ fast internet. Wait let me try that again. Most people don’t have smokin’ fast internet, especially not all the time. It’s part of the job to make sure our sites aren’t so slow we’re essentially depriving users access. To experience your site with slow internet, under the Network tab of DevTools […]

Masonry and reading order

By Chris Coyier on

Two months back there was a bit of a hubbub about masonry layout in CSS with Jen at Apple making a case and Rachel at Google agreeing those use cases would be great, but should be based on display: masonry; not display: grid;. Then: nothing. Web standards just move at the pace that it moves […]

Live Demos of Stand Alone Web Components

By Chris Coyier on

A “stand alone” Web Component is a Web Component that provides some design or functionality but that has little by way of dependencies, strong opinions, or heavy design. In other words, Web Components that could easily imagine sliding into any project without much trouble.

Design Spells

By Chris Coyier on

I feel like I haven’t seen a really nice web design inspiration gallery in a while so Design Spells is really doing it for me. Design details that feel like magic. I think it’s the focus on websites. 😍

A common web component learning blunder

By Chris Coyier on

Dave posts about this common web component learning blunder. The blunder is… not using a framework. I’m very guilty of this myself. I was just commenting about how the lifespan of web components could be wonderfully long if we keep them dependency free, which theoretically we can because they are a native part of the […]

Nesting/Overriding Properties in CSS

By Chris Coyier on

Some things you just can’t undo in CSS. But, perhaps unintuitively, that does work with visibility. Ben Nadel makes the point that pointer-events is another one of those properties that allows you to “undo” what a parent has set. It’s like pointer-events just cascades down to descendent elements and you override it, but some properties […]