Collective #557

Original Source:


How to design delightful dark themes

In this article Teresa Man shares how to design dark themes that are readable, balanced, and delightful.

Read it



A reusable JavaScript library for creating sketchy/hand-drawn styled charts in the browser.

Check it out


Our Sponsor
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


Spotify TUI

A Spotify client for the terminal written in Rust. By Alexander Keliris.

Check it out


Design System Playground

Play with typography, colors and themeable components in your design system. By John Polacek.

Check it out


Mini Tokyo 3D

A real-time 3D digital map of Tokyo’s public transport system. By Akihiko Kusanagi.

Check it out


The wondrous world of CSS counters

An in-depth look at CSS counters, how they’ve expanded with better support for internationalization and how it’s possible to implement a pure CSS Fizzbuzz solution with them.

Read it



GitSheet is a simple git cheat sheet reference for common git commands.

Check it out


100% CSS Mario Kart

Stephen Cook creates an interactive version of Mario Kart using only CSS.

Watch it


Dynamic CSS Components Without JavaScript

Learn how pure CSS components are achievable with custom properties.

Read it


Clip-path converter

A very useful tool if you want to prepare SVG paths to be used with CSS clip-path. By Yoksel.

Check it out


CSS is Awesome – Variable fonts Edition

A fun demo by Mandy Michael that shows how variable fonts can fix CSS 😜

Check it out


The “P” in Progressive Enhancement stands for “Pragmatism”

Andy Bell explains progressive enhancement in a more practical way.

Read it


Advanced JavaScript Node.js Promises chaining collections

Learn how to use advanced features of JavaScript Promises using Node.js with this programming tutorial.

Read it


Intro to SVG for React Developers

A tutorial by Daniel Matarazzo where you’ll build a colorful spinning loading indicator as a React component, using some very simple SVG markup.

Read it


The W3C At Twenty-Five

In this article, Rachel Andrew explains how the W3C works and shares her “Web Story” to explain why the Web Standards process is so vitally important for everyone to have an open web platform where they can share their stories and build awesome things for the web together.

Read it


The Open Book Project

Joey Castillo is on a mission to create a simple book reading device that anyone with a soldering iron can build for themselves.

Check it out



Able is a bootstrapped community for people to read and write about software.

Check it out


Patterns for Practical CSS Custom Properties Use

Tyler Childs shows some examples of patterns for Custom Properties from his Cutestrap framework.

Read it


1 element card background patterns (see description)

A pure CSS technique for creating patterns that doesn’t use SVGs or images other than CSS gradients. By Ana Tudor.

Check it out


The SQL Murder Mystery

Use SQL queries to solve the murder mystery. Suitable for beginners or experienced SQL sleuths.

Check it out


js13kGames Winners

Check out the winners of this year’s Js13kGames competition.

Check it out


Blocke: Social web UI kit

A free social UI kit from Blocke that includes 3 ready-made screens with 30+ components that might come in handy for building a social feed.

Check it out


From Our Blog
Create Text in Three.js with Three-bmfont-text

A short tutorial on how to create animated text in Three.js with three-bmfont-text and give it a nice look using shaders.

Read it

Collective #557 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 *