Wrapping Animated 3D Marquee Text with Pure CSS
For a long time I’ve been interested in making a text crawl for web pages where the text moved around corners. While there are several ways of accomplishing this - WebGL among them - I wanted a solution that would be fairly straightforward, one that could be written using just HTML and CSS.
Create Web Page Cinemagraphs with CSS 3D Transforms
“Cinemagraphs” are animated photographs that feature repeated and subtle movement. Early experiments by Kevin Burg and Jamie Beck in fashion photography led to the format’s modern popularity.
But GIFs - the usual source for cinegraphs - aren’t a video format, and can’t be controlled very well. In addition, creating a true cinemagraph can require a lot of work. Over the weekend I realized that for some images the same effect could be created using CSS 3D transforms. As an alternative to the expense of shooting full video, this could be a valuable, performant and efficient technique for product demos and visualizations.