Collective #615

Original Source: http://feedproxy.google.com/~r/tympanus/~3/EVntoo9aXpU/

Inspirational Website of the Week: Sweet punk

Great visual content with a clear design and interesting details. Our pick this week.

Get inspired

Our Sponsor
Build websites with the most popular WordPress theme in the world

With the Divi Layout Packs you’ll get world-class designs ready to be used for your client projects.

Check it out

Primo

Primo is an all-in-one IDE, CMS, component library, and static site generator.

Check it out

What the f*** is …?

An opinionated glossary of computer science terms for front-end developers by Dan Abramov. Read more about it in the repo.

Check it out

CSS easing

Adam Argyle shares 18 hip cubic-bezier easing functions in handy variables with us.

Check it out

3D Hands gestures

An amazing free 3D hands gestures library with 12 hands gestures in 9 different skin tones and with 3 sleeve types.

Check it out

3D Book Image CSS Generator

Fantastic tool: Generate an animated 3D image from a book cover and export to HTML/CSS to embed on your website.

Check it out

@property: giving superpowers to CSS variables

Una Kravets introduces the Houdini Properties and Values API which is coming to your CSS file in Chromium 85.

Read it

Things I Wish I’d Known About CSS

Some useful things to understand before starting out with CSS. By Dave Smyth.

Check it out

Understanding CSS Multiple Backgrounds

In this article, Ahmad Shadeed explains the background-image property in detail, and provides a visual explainer on how multiple backgrounds can be stacked.

Read it

CSS leaning card effect

A beautiful card effect made by Lynn Fisher.

Check it out

A Simple Explanation of Event Delegation in JavaScript

Dmitri Pavlutin explains event delegation which is a useful pattern to listen for events on multiple elements using just one event handler.

Read it

Import non-ESM libraries in ES Modules, with client-side vanilla JS

Lea Verou explores some strategies of importing non-ESM libraries in ES modules.

Read it

A CSS only “click to animate gif” solution

Christian Heilmann shares a quick experiment in pure CSS how to cover a GIF with a play button instead of playing it

Check it out

Warp SVG Online

A nice tool that can warp and distort SVGs.

Check it out

css-media-vars

A brand new way to write responsive CSS. Named breakpoints, DRY selectors, no scripts, no builds, vanilla CSS.

Check it out

Modern CSS Techniques To Improve Legibility

Edoardo Cavazza covers how to improve websites legibility using some modern CSS techniques.

Read it

A CSS-only, animated, wrapping underline

NickyMeuleman explores how to create wrapping underlines that can be animated.

Read it

Building a self-updating profile README for GitHub

Simon Willison shows how to implement a GitHub Action to automatically keep a profile README up-to-date.

Check it out

CSS Painting Order

An interesting article on how a browser determines what order to paint content in.

Read it

Beyond screen sizes: responsive design in 2020

Kilian Valkhof thinks we’re now at a point where we can start considering a new type of responsiveness for websites.

Read it

Rich HTML in GitHub README

Learn how to create a rich HTML document enveloped in an SVG file.

Check it out

Mars Explorer ScrollTrigger demo

Hai Le made this fantastic GSAP ScrollTrigger plugin example.

Check it out

Droplets

Stunningly realistic CSS droplets by Oscar Salazar.

Check it out

The post Collective #615 appeared first on Codrops.