Collective #733
![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_wotw.jpg?x25555)
Inspirational Website of the Week: Junni is...
Funky and adorable, thats's this website's vibe and we love it! Our pick this week.
Get inspired![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_kintone.png?x25555)
Provide full visibility throughout your tasks and projects
Build custom cloud databases swiftly and connect them to Slack.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_patterns.jpg?x25555)
New patterns for amazing apps
Dive into a fantastic collection of new patterns for amazing apps, including clipboard patterns, file patterns, and advanced app patterns. By Thomas Steiner.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_grid.jpg?x25555)
Layout Breakouts with CSS Grid
Ryan Mulligan writes about extending elements beyond the content area with CSS Grid and named grid lines.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_svgs.jpg?x25555)
SVG sprites: old-school, modern, unknown, and forgotten
Vadim Makeev explores other less-known options for using SVG icons and other graphics on a website.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_fonts.jpg?x25555)
Fallback Font Generator
Reduce Cumulative Layout Shift (CLS) by adjusting web fonts and system font fallbacks using special @font-face descriptors.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_figma.jpg?x25555)
Design Systems For Figma
A collection of Design Systems for Figma from all over the globe.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_transition.jpg?x25555)
The Web’s Next Transition
Kent C. Dodds writes about the web's next big transformation: Progressively Enhanced Single Page Apps.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_sandbox.jpg?x25555)
A World-Class Code Playground with Sandpack
Josh W Comeau shares his experience with Sandpack, a modern playground framework built by the folks at CodeSandbox.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_queries.jpg?x25555)
Early Days of Container Style Queries
Some interesting insights into Container Style Queries by Geoff Graham.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_netnewswire.jpg?x25555)
NetNewsWire
In case you didn't know about it: A free and open source RSS reader for Mac and iOS.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_cards.jpg?x25555)
Introducing OG Image Generation: Fast, dynamic social card images at the Edge
Read all about the new library for generating dynamic social card images.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_halftone.jpg?x25555)
CSS Halftone Patterns
Michelle Barker's exploration of vanilla CSS halftone patterns.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_100days.jpg?x25555)
100 Days Of More Or Less Modern CSS
A blog post about modern CSS every day for 100 days. By Manuel Matuzović.
Read it![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_sky.jpg?x25555)
Stellarium 1.0
The Stellarium team did it. Stellarium 1.0 is here!
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_contrast.jpg?x25555)
Randoma11y
Generate an infinite amount of accessible color combinations with this cool tool.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_satori.jpg?x25555)
Satori
In case you didn't know about it: a library to convert HTML and CSS to SVG.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_yuri.jpg?x25555)
How to Code a Three.js Postprocessing Transition
A video coding session where you’ll learn how to code a transition with Three.js and postprocessing.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_websitesroundup.jpg?x25555)
Inspirational Websites Roundup #42
The latest, most trendy websites with an excellent design for your inspiration.
Check it out![](https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2022/10/C733_scroll.jpg?x25555)
Smooth Panel Scroll Effects
An exploration of smooth panel scroll effects based on Margot Priolet's website.
Check it out