Collective #581

Original Source: http://feedproxy.google.com/~r/tympanus/~3/N-qK3a4dDyc/

Inspirational Website of the Week: NT

On Nathan Taylor’s portfolio everything is interactive! A true digital pleasure. Our pick this week.

Get inspired

Magical Rainbow Gradients with CSS Houdini and React Hooks

A great tutorial by Josh Comeau about a very creative way to animate magical gradients!

Read it

Tiny Helpers

Easily find useful single-purpose online tools on this site made by Stefan Judis.

Check it out

Our Sponsor
Start your own freelance business by becoming a Divi developer

Learn how to develop websites with the most popular WordPress theme in the world and secure your success as a freelancer.

Start learning now

Exploring the Web Animations API

Charlie Gerard walks us through a practical Web Animations API example.

Read it

Free Font: JetBrains Mono

A really great looking monospace font made for developers by JetBrains.

Check it out

An Introduction To React’s Context API

In this article, you will learn how to use React’s Context API which allows you to manage global application states in your React apps without resorting to props drilling.

Read it

Design Password

A fun designer-friendly password generator.

Check it out

Dark Isn’t Just a Mode

Steven Hoober takes a look at what it means to be in dark mode, why it exists, and what the research on dark mode says.

Read it

Is reduce() bad?

Jake and Surma discuss the array function reduce() and answer the question if it’s good to use it.

Watch it

The paradox at the heart of A/B testing

Matthew Ström writes about how the fundamental ideas of A/B tests contain a contradiction that calls their value into question.

Read it

CSS4 is here!

Peter-Paul Koch proposes that web developers start saying “CSS4 is here!”, for the marketing effect.

Read it

SVG Pattern Doodler

A fantastic demo by Niklas Knaack where unique art is generated by an algorithm.

Check it out

Masonry layout

An exciting proposal to extend CSS Grid to support a masonry-type layout. By Mats Palmgren.

Check it out

Adding separators to layouts with CSS-in-JS

Mandy Michael writes about how to add separators to a grid using a combination of :not and :nth-child with a pseudo-element.

Read it

beedii

A hand-drawn Emoji set by Nitish Khagwal and Prafful Kumar.

Check it out

I have been underestimating JS

Alfonso de la Rocha shares his experience with digging deeper into JavaScript to have better low-level control.

Read it

Pure CSS dial button

A configurable CSS dial button demo by Jhey Tompkins.

Check it out

Flexbox Responsive Form

Adam Argyle created this responsive form with four potential layouts that is powered by Flexbox.

Check it out

30 seconds of code

What started with short JavaScript snippets has now grown into a snippet collection for all your development needs.

Check it out

From Our Blog
3D Folding Layout Technique for HTML Elements

A tutorial on an experimental 3D layout technique for HTML elements with endless possibilities.

Check it out

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