Collective #430

Inspirational Website of the Week: An Interesting Day
No animations but a brilliant layout and a unique design with some nice details. Our pick this week.
Get inspired
Bloom: eMail Opt-In And Lead Generation Plugin For WordPress
Bloom gives you the power to display opt-in forms using integrations of the most popular email marketing systems available.
Check it out
Publii
Publii is a static-website-building tool for every skill level with a GUI to build a safe, fast and stylish website.
Check it out
CSS Grid in IE: CSS Grid and the New Autoprefixer
Daniel Tonon's three-part series on CSS Grid in Internet Explorer. In this second part he tackles the common misconception that the IE implementation of CSS grid is extremely difficult.
Read it
Introduction to Feature Policy
Learn everything about "Feature Policy" which allows web developers to selectively enable, disable, and modify the behavior of certain APIs and web features in the browser. By Eric Bidelman.
Read it
CSS Grid Level 2: Here Comes Subgrid
Rachel Andrew explains the new features of CSS Grid Level 2.
Read it
CSS Doodles
A lovely set of CSS doodles by Agathe Cocco.
Check it out
The Mutable Gallery
A collection of generative artworks by Heydon Pickering.
Check it out
Textalytic
Textalytic is a free Natural Language Processing service that handles pre-processing, analyzing, and visualization in an easy to use web interface.
Check it out
The guide to integrating and styling icon systems?- SVG sprites, SVG symbols and icon fonts
The second part in a two-part series on icon systems with focus on SVG image sprites, SVG symbols and icon fonts. By Sebastiano Guerriero.
Read it
Physics-Based Background Scroll Effects
In case you missed it: a tutorial on how to create an animated background effect with Matter.js.
Read it
Infinitely drawing icons
A great loading animation of icons by Mikael Ainalem.
Check it out
Clock Shop
A collection of beautiful and unusual clock demos.
Check it out
The Link Bar, an Ecommerce Mobile Homepage Navigation Alternative (to the Hamburger Menu)
Some interesting AB test results of using the link bar navigation pattern in mobile sites.
Check it out
Beyond Likert scales: how we made boring form-filling more fun
Read how the team at JotForm made their forms more fun to use.
Read it
picCSSel Art
A tool to create CSS pixel art made by Kushagra Gour.
Check it out
Ghost Mouse
A fantastic demo by Liam Egan where a blob like element moves with the mouse/finger.
Check it out
Brad's Homelab
Brad Fitzpatrick's home lab setup for highly-available internet.
Check it out
Clearfix: A Lesson in Web Development Evolution
Jason Hoffman takes a look at the history of the famous CSS clearfix hack.
Read it
termtosvg
A Linux terminal recorder written in Python that renders your command line sessions as standalone SVG animations.
Check it out
Free Font: Akrotiri
A playful rounded font made by Ilya Zakharov.
Get it