Collective #727
Publikováno: 1.9.2022
VRSEAT * Nutshell * Bespoke WebGL Postprocessing * Headway * Use the Right Container Query Syntax
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_WOTW.jpg)
Inspirational Website of the Week: FREAK MAG.
A nice, unusual design with fun details and fresh colors. Our pick this week.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/08/summer22_first-chance_square.jpg)
Our Sponsor
Our annual Summer Sale is back! This is one of only a few times we offer our biggest discounts. Get 20% off Divi, 40% off Divi Cloud and up to 50% off products in the Divi Marketplace!
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_containerqueries.jpg)
CSS container queries are finally here
Ahmad Shadeed writes about CSS container queries and how to use this amazing, newly supported feature in CSS.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_howcontainer.jpg)
Use the Right Container Query Syntax
Miriam Suzanne shows how to use the new size queries in CSS.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_nutshell.jpg)
Nutshell
Nutshell is a tool to make “expandable, embeddable explanations”.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_diffusion.jpg)
4.2 Gigabytes, or: How to Draw Anything
A very interesting article on how to use Stable Diffusion for creating AGI art.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_seats.jpg)
VRSEAT
An immersive 3D experience using Three.js for a seat picker that emulates the experience. A new project by Anderson Mancini.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/Screen-Shot-2022-09-01-at-11.04.25.jpg)
React Just Parallax
React library for scroll and mousemove parallax effects. Open source and production-ready.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_bike.jpg)
Bike Demo Three.js
Kiril Bernard Tucker created this fictive project to showcase his current skills using Three.js and GSAP.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_planes.jpg)
Building an aircraft radar system in JavaScript
Using a Software Defined Radio dongle, an antenna and the Web USB API, Charlie Gerard built an aircraft radar system to receive live data from planes flying by.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_pattern.jpg)
Coding a crazy weave pattern
In this video tutorial Martijn Steinrucken shows how to create a weaved pattern shader.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_threejsdancing.jpg)
Carla Trail
Ichitaro Masuda’s impressive Three.js experiment.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_canva.jpg)
Bespoke WebGL Postprocessing
Daniel Velasquez is exploring bespoke post-processing effects for day-to-day websites.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_gallerydalle.jpg)
OpenArt
Get inspired from millions of amazing DALL·E 2 art and prompts.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_bem.jpg)
Modern alternatives to BEM
Dave Rupert is brainstorming a handful of new CSS organization acronyms.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_has.jpg)
Parents counting children in CSS
Manuel Matuzović shows how to use :has() to select parent elements that have a specific number of children.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_spider.jpg)
Spider
A creepy demo by Stranger in the Q.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_heart.jpg)
lllove
An SVG heart maker that makes it easy to design heart shapes and save them as SVG to use in your print or web designs.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_maps.jpg)
Headway
Self-hostable maps stack, powered by OpenStreetMap.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_nocode.jpg)
Popsy
A no-code website builder that works like Notion where you can customize a design and publish.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_git.jpg)
WebKit on GitHub!
Read how the WebKit project froze its Subversion tree and transitioned management and interaction with source code to git on GitHub.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_google.jpg)
Googerteller
Audible feedback any time your computer sends a packet to a tracker or a Google service.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_react.jpg)
Canva clone
React design editor using fabric.js for creating images presentations and video.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_dig.jpg)
Digs.fm
Track and organize music releases you want to listen, listened or liked.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/09/C727_zero.jpg)
Why do arrays start at 0?
An intetesting article on why arrays start at 0.
![collective 727 item image](https://i7x7p5b7.stackpathcdn.com/codrops/wp-content/uploads/2022/08/websites41.jpg)
From Our Blog
Inspirational Websites Roundup #41
A new, handpicked collection of the most creative and inspirational websites.