Collective #741
![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_WOTW.jpg?x25555)
Inspirational Website of the Week: Unseen Studio
A beautiful, immersive web experience with stunning animations. Our pick this week.
Get inspired![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/DH-Codrops-350.png?x25555)
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.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_viewport.jpg?x25555)
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.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_colors.jpg?x25555)
Color Formats in CSS
In this tutorial, Josh W Comeau takes you on a tour of all the different color options in CSS.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_grid.jpg?x25555)
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.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_cup.jpg?x25555)
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.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_d2.jpg?x25555)
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.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_gpu.jpg?x25555)
gpu-io
A GPU-accelerated computing library for physics simulations and other mathematical calculations. Read more in this thread and check out the examples.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_ink.jpg?x25555)
Inkbase: Programmable Ink
What would be possible if hand-drawn sketches were programmable like spreadsheets? An amazing project shows what can be achieved.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_languages.jpg?x25555)
Little Languages Are The Future Of Programming
Learn what "Little Languages" are, why they matter and how they will shape the future of programming.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_openweb.jpg?x25555)
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.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_bbc.jpg?x25555)
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.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_peg.jpg?x25555)
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.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_score.jpg?x25555)
Score
Score is an open source, platform-agnostic, container-based workload specification.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_nohtml.jpg?x25555)
You don't need HTML!
Sir Tim lied to you, you only need Unicode! ;)
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_secrets.jpg?x25555)
Infisical
An open source, end-to-end encrypted tool that lets you securely sync secrets and environment variables across your team and infrastructure.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_terminal.jpg?x25555)
Llama
A simple and minimalistic terminal file manager.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_act.jpg?x25555)
Act
Run your GitHub Actions locally for fast feedback and replacing your makefile.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_transitions.jpg?x25555)
Sekisui House Fact Book 2022
A beautiful interactive web experience with creative transitions powered by Three.js.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_sobel.jpg?x25555)
Three.js and Sobel
Jesper Vos explains how he coded very interesting portal effect.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_logos.jpg?x25555)
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.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/12/C741_pencil.jpg?x25555)
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.
Read it