Collective #544

Original Source:


Inspirational Website of the Week: Save whales

A beautiful website dedicated to a wonderful creature. Lovely transitions and 3D models. Our pick this week.

Get inspired


SVG Artista

SVG Artista is a useful tool that helps you animate strokes and fills in your SVG image with CSS transitions.

Check it out


Our Sponsor
The Ultimate WordPress Page Builder

You’ve never built a WordPress website like this before. Divi is more than just a WordPress theme, it’s a completely new website building platform that replaces the standard WordPress post editor with a vastly superior visual editor.

Try it


Designing Dark Mode

Jon Friedman shares how Dark Mode experiences are being crafted across Microsoft 365.

Read it


Bottom Navigation Pattern On Mobile Web Pages: A Better Alternative?

Arthur Leonov explores a better alternative to the mobile top navigation pattern with a hamburger menu.

Read it


Color Palette Generator

A superb color palette generator that will create truly working color themes.

Check it out


Sorry Not Sorry

A fantastic experiment that shows the magical power of variable fonts.

Check it out


3D Switch animation

A truly amazing little switch component with a 3D twist. By Aaron Iker.

Check it out


Creating a Maintainable Icon System with Sass

Tracy Rotton explains how to tackle the drawbacks of the data URL background image technique for including icons.

Read it


Get started with GPU Compute on the Web

François Beaufort plays with the experimental WebGPU API and shares his journey with web developers interested in performing data-parallel computations using the GPU.

Read it


Color Collision

A really cool game made by Sikriti Dakua.

Check it out


Optional chaining

Learn all about the optional chaining operator and what you can do with it.

Read it


Announcing TypeScript 3.6

Learn about all the exciting new features of Typescript 3.6 in this article by Daniel Rosenwasser.

Read it


How to Accessibly Split Text

Michelle Barker takes a look at why splitting a string of text can be problematic from an accessibility point of view, and what we can do to make sure that split text is accessible to everyone.

Read it


Label Studio

Label Studio is a multi-type data labeling and annotation tool with standardized output format.

Check it out


Drag & Drop Elements with Vanilla JavaScript and HTML

Jess Mitchell shows how to create a drag and drop feature using the HTML Drag and Drop API with a little vanilla JavaScript to set up the event handlers.

Read it


Voice User Interface Design by Cheryl Platz

Jeremy Keith’s liveblog of Cheryl Platz’s An Event Apart presentation on voice interfaces.

Read it


Optional HTML: Everything You Need to Know

Jens Oliver Meiert gives an overview of what HTML code is optional.

Read it


Perfect loops in Processing

Some valuable tips on creating slick looping animations in Processing.

Read it


Color this sofa! – SVG + Blend Mode trick

Kyle Wetton created this amazing demo where you can color a sofa using some smart SVG and blend mode trickery.

Check it out


Calculating PI Using Raindrops

A great demo by Mustafa Enes which is based on a real-life experiment that gives an approximation to PI.

Check it out


CSS Can Do This… And It’s Terrifying!

Aaron Powell lists some interesting ways to “exploit” CSS.

Read it

Bear Illustration Process

Illustrator Pierre Kleinhouse shares some insight on his process and answers some interesting questions.

Watch it



Johan Karlsson implemented the Bowyer-Watson algorithm to perform the Delaynay triangulation. Click to generate a new pattern.

Check it out


The problem with tooltips and what to do instead

Adam Silver lists the numerous problems that come with using tooltips to reveal more content.

Read it



A friendly reminder that the epic JavaScript coding competition for HTML5 Game Developers is still running for 2 weeks.

Check it out

Collective #544 was written by Pedro Botelho and published on Codrops.

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *