Collective #783
Inspirational Website of the Week: 14islands
This week's standout is 14islands' newest design, a true testament to creativity. With delightful water-themed interactions, mesmerizing WebGL distortion, and striking typography effects, it's a visual treat. The page transitions are seamless, and an exciting easter egg interaction awaits in the footer.
Get inspired
From our sponsor Book this sponsorship
Wix Studio - The new web creation platform built for agencies
Wix launched a new platform for agencies that offer bespoke & scalable web creation services. With next-gen design capabilities, custom dev opportunities & multi-project workspaces, web pros can deliver their best creations, in a way that makes business sense.
Join the waitlist
The Tyranny of the Marginal User
Ivan Vendrov reflects on the trend of consumer software becoming less user-centric, attributing this shift to the "Tyranny of the Marginal User" and the focus on attracting and retaining users with short attention spans and minimal interest in customization.
Read it
Astro + View Transitions Photo Gallery
This great Astro Photo Gallery demo is a fresh View Transitions and Astro template by Addy Osmani and Maxi Ferreira. Comes with super cool "Death by JavaScript" illustrations ;)
Check it out
A (more) Modern CSS Reset
Andy Bell acknowledges that his previously published "A Modern CSS Reset" from four years ago has become outdated and provides an updated version of the CSS reset, explaining each rule in detail and offering insights into their rationale, concluding that while resets are useful, they may not be necessary due to the advancements in web browsers, and encourages readers to create their own tailored resets.
Read it
How Custom Property Values are Computed
Stephanie Eckles writes about the complexities of using custom properties (CSS variables) and highlights issues related to how browsers compute final property values, covering topics such as computed, inherited, and initial values, computed value time, and the impact on modern CSS support, along with strategies to prevent custom property failures.
Read it
Google gets its way, bakes a user-tracking ad platform directly into Chrome
Read how Chrome has launched an invasive ad platform, ironically called the "Privacy Sandbox," which tracks users and shares advertising topics with web pages, despite widespread opposition, as Google aims to secure its advertising business in response to third-party cookie blocking by Apple and Firefox.
Read it
From WebGL to WebGPU
In this article, François Beaufort discusses the transition from WebGL to WebGPU, highlighting key differences between the two technologies, including state management, asynchronous operations, the introduction of compute shaders, video frame processing capabilities, and more.
Read it
Understanding the JavaScript Modulo Operator
In this blog post, Josh W Comeau explains the Modulo operator (%) and how it works by refining the mental model of division, with a practical use case for circular arrays in web development.
Read it
Spirals
Generate beautiful AI spiral art with one click. Powered by Vercel and Replicate. An open source project by Steven Tey.
Check it out
Web Sustainability Guidelines (WSG) 1.0
The draft for the Web Sustainability Guidelines (WSG) 1.0 covers a wide range of recommendations for making websites and products more sustainable.
Check it out
EmojiGen
EmojiGen is an open source emoji generator where you can input anything and a emoji style image is generated.
Check it out
Solved by CSS Scroll-Driven Animations: Detect if an element can scroll or not
Bramus discusses how to use Scroll-Driven Animations in CSS to detect whether an element can scroll and provides code examples for achieving this functionality, along with variations for developer convenience and a practical example of improving scroll indicators.
Read it
Sticky popout bento effect
Jhey Thompkins shares how you can achieve an amazing popout bento effect with position: sticky and scroll-driven animation.
Check it out
JPEG and EXIF Data Manipulation in JavaScript
This article provides a detailed guide on how to read and update EXIF metadata in JPEG images using JavaScript, covering topics such as EXIF structure, segment delimitations, IFD directories, tag formats, and endianness detection.
Check it out
CSS Findings From The Threads App: Part 2
Ahmad Shadeed shares a couple of interesting CSS findings from the threads app by Meta.
Read it
Rivet
Rivet is an open-source visual AI programming environment designed for building AI agents with large language models (LLMs), allowing teams to collaborate on complex LLM prompt graphs and deploy them in their applications with features like visualization, remote debugging, and collaboration tools.
Check it out
LÖVE: Free 2D Game Engine
A free and open-source framework for creating 2D games in Lua with cross-platform compatibility.
Check it out
View.py
A lightning-fast, modern web framework in Python. It's still high alpha state and many features are on the way. Help by contributing to it.
Check it out
The Project Gutenberg Open Audiobook Collection
Thousands of free and open audiobooks powered by Project Gutenberg, Microsoft, and MIT.
Check it out
From our blog
UI Interactions & Animations Roundup #36
Get inspired by selected motion designs and UI interaction works of amazing designers on Dribbble.
Check it out