Collective #741
Publikováno: 1.12.2022
Color Formats in CSS * gpu-io * Inkbase * Infisical * The large, small, and dynamic viewport units

Inspirational Website of the Week: Unseen Studio
A beautiful, immersive web experience with stunning animations. Our pick this week.

This content is sponsored via BuySellAds
Practical, no-nonsense UI design tips
The Design Hacks newsletter will help you create better designs (even if you’re not artsy). Over 50,000 readers.

The large, small, and dynamic viewport units
Learn all about the new CSS units that account for mobile viewports with dynamic toolbars in this article by Bramus Van Damme.

Color Formats in CSS
In this tutorial, Josh W Comeau takes you on a tour of all the different color options in CSS.

The easiest way to get started with CSS Grid
A simple, straightforward guide to CSS Grid using grid-template-areas property to visually set the grid structure.

GenCup
A generative art project that combines graphic design, football, and data. Using the statics of FIFA World Cup games to generate abstract compositions. Every match is a new poster.

D2
D2 is a domain-specific language (DSL) that stands for Declarative Diagramming where you describe what you want diagrammed and it generates the image.

gpu-io
A GPU-accelerated computing library for physics simulations and other mathematical calculations. Read more in this thread and check out the examples.

Inkbase: Programmable Ink
What would be possible if hand-drawn sketches were programmable like spreadsheets? An amazing project shows what can be achieved.

Little Languages Are The Future Of Programming
Learn what “Little Languages” are, why they matter and how they will shape the future of programming.

What Is the Open Web?
A working definition of an Open Web and what we can strive for to building an open and sustainable internet.

The BBC’s 15 Web Principles – 15 years later
Back in 2007 the BBC published a document showing their 15 Web Principles. Terence Eden takes a look at how they stack up today.

FFmpeg – Ultimate Guide
This guide covers the ins and outs of FFmpeg starting with fundamental concepts and moving to media transcoding and video and audio processing along with practical example.

Score
Score is an open source, platform-agnostic, container-based workload specification.

You don’t need HTML!
Sir Tim lied to you, you only need Unicode!

Infisical
An open source, end-to-end encrypted tool that lets you securely sync secrets and environment variables across your team and infrastructure.

Llama
A simple and minimalistic terminal file manager.

Act
Run your GitHub Actions locally for fast feedback and replacing your makefile.

Sekisui House Fact Book 2022
A beautiful interactive web experience with creative transitions powered by Three.js.

Three.js and Sobel
Jesper Vos explains how he coded very interesting portal effect.

Three CSS tips for working with inconsistently sized logos
Some super useful CSS to work with logos that are of a different size. By Wes Bos.

From Our Blog
Sketchy Pencil Effect with Three.js Post-Processing
A tutorial where you’ll learn how to create a pencil effect with a sketchy look using Three.js post-processing.