The element in SVG is the ultimate drawing element. It can draw anything! I’ve heard that under the hood all the other drawing elements ultimately use path anyway. The path element takes a single attribute to describe what it draws: …
There was a time when the smart move in picking fonts for a website was to a font-family that was supported across as many platforms as possible. font-family: Tahoma; and whatnot. Or even better, a font stack that would fall …
Making your SVG accessible includes adding extra steps to your workflow, but is well-worth it. By embracing clean, semantic markup and taking advantage of some of the less well-known features of CSS, you can create easily maintainable solutions that include …
Paul Lewis animated a 3D Card Flip. Straightforward enough there, but this needed a shadow element as well:
…The shadow may need to move around or fade, so we need a solution that we can animate with transforms & opacity,
Bjørn Johansen covers why:
Jake Archibald in the comments:
…In hindsight there probably
I recently worked on a project that was getting a ton of traffic but users were bouncing because the page load was too long at around 10 seconds. They called me in because the majority of the images on …
I recently saw this loader on CodePen, a pure CSS 3D rotating set of bars with a fading reflection. It’s done by using an element for each bar, then duplicating each and every one of these elements to create the …
Scalable Vector Graphic (SVG) is emerging as the preferred graphic format to use on the web today. Are you abandoning the icon font or replacing old pg, gif and png graphics for the well-supported SVG, too? Let’s see how this …
Solid basics of an SVG icon system in this guide from Florens Verschelde, mixed with some good tricks: the two-color trick, pre-loading the sprite, and using custom properties for unlimited color variations. Also an interesting bit about using multiple methods …
Much has been written about how SVG filters can be used to style images or manipulate shapes or even make crazy animations.
But I haven’t seen much about how SVG filters can be used to style text recently. Thankfully, …
I recently went to Michael Jackson and Ryan Florence’s ReactJS Training. I was really excited to attend, partially because I had so many questions about SVG and React. There are a lot of bits about working with React and …
