Collective #678
Inspirational Website of the Week: Miti Navi
Beautiful shapes with modern and elegant typography make this site a true masterpiece.
Get inspired
Translate designs to developer-friendly code with Anima
Use Anima to translate designs into developer-friendly React, Vue & HTML code. As in, code you can actually work with.
Learn more
Developer Decisions For Building Flexible Components
In this article, Michelle Barker walks us through the process of taking a seemingly simple design for a text-and-media component and deciding how best to translate it into code, keeping in mind the needs of both users and content authors.
Read it
Building a split-button component
A foundational overview of how to build an accessible split-button component. By Adam Argyle.
Read it
My Room in 3D
Bruno Simon finished his amazing room in 3D, a fantastic demo of a blend of technologies.
Check it out
YT-DLP
A youtube-dl fork based on the now inactive youtube-dlc. The main focus of this project is adding new features and patches while also keeping up to date with the original project.
Check it out
Roadroller: Flattens Your JavaScript Demo
Roadroller is a heavyweight JavaScript packer designed for large demos of at least 10 KB in size, like js13kGames. Depending on the input it can provide up to 15% additional compression compared to Zopfli.
Check it out
Practice / 3.js
An amazing particle experiment by Toshiya Marukubo (smartphone not supported).
Check it out
Using the platform
Elise Hein shows how important it is to “know the platform” and be able to develop web apps without frameworks or build tools.
Read it
Learning in the Open
Michelle Barker’s article on how learning by doing is the most effective way to learn anything.
Read it
Pollen
Pollen is a TailwindCSS-inspired library of CSS variables for rapid prototyping, consistent styling, and as a zero-runtime utility-first foundation for your own design systems.
Check it out
HTML checkboxes Webcam filter
Bryan Braun made this fun webcam filter out of HTML checkboxes.
Check it out
Bundling non-JavaScript resources
Learn how to import and bundle various types of assets from JavaScript in this article by Ingvar Stepanyan.
Read it
Monkey Island Tribute, a WebGL Experience
A beautiful WebGL experience by Sébastien Lempens.
Check it out
Warmth
A wonderful Three.js sketch made by Ryohei Ukon.
Check it out
SVGOMG
Jake Archibald released a new version of this great tool powered by SVGO v2.5.0.
Check it out
Houdini.how
A super-cool CSS Houdini worklet made by George Francis.
Check it out
58% of Hacker News, Reddit and tech-savvy audiences block Google Analytics
Marco Saric investigates how much data is missing from Google Analytics due to adblockers and privacy-friendly browsers.
Check it out
Madbox
Madbox is a mobile gaming company and for their new website they collaborated with Bruno Simon. There’s also this awesome little game that you can play in the browser.
Check it out
Inspirational Websites Roundup #29
A new collection of the best web designs and creative websites from the past couple of weeks.
Check it out