Editor's Pick
Motion - A modern animation library for JavaScript and React
Motion is built on native browser APIs for a tiny filesize and superfast performance. It uses hardware acceleration for smooth and eco-friendly animations. Previously Framer Motion.
CSS
Folded rectangle shapes using CSS mask
Create folded rectangle shapes with a subtle 3D effect
- Single element (no pseudo-element)
- Optimized with CSS Variables
- Powered by CSS mask
Based on CSS Shapes which is worth a look as well.
Scroll-Driven… Sections
I was checking out a very cool art-directed article the other day, full of scrollytelling, and, like us web devs will be forever cursed to do, wondering what they used to build it. Spoiler: it’s GSAP and ScrollTrigger.
No shame in those tech choices, they are great. But with scroll-driven animations now being a web standard with growing support, it begs the question whether we could do this with native technologies.
Orbit - the first CSS framework designed specifically for building radial user interfaces
Orbit is the first general-purpose CSS framework designed specifically for radial user interfaces. We've used the latest CSS features to make building radial layouts a breeze. It provides intuitive CSS classes and Custom Elements for building radial menus, dashboards, creative portfolios, or a cutting-edge applications.
Because creating radial UIs generally involves resorting to JS or other languages to calculate angles, radius, distances, etc. Orbit helps and saves you a lot of time by allowing you to build these UIs with just CSS.
Creating 3D effects in CSS
Learn how to create 3D effects with CSS using properties like transform and perspective to elevate your web designs.
A pure css implementation of some sunlight streaming in through the window
Inspired by https://daylightcomputer.com and https://www.sunlit.place.
No Javascript needed - Accomplished simply with the power of HTML and CSS
A lot of cool designs can be created with just HTML and CSS. For the following examples I use labels, radio and checkbox inputs in combination with the css selectors :checked, + and ~.
HTML
Less Common HTML Elements and How to Use Them in Your Code
HTML has a lot of tags that many people use every day, like <div>, <p>, and <a>. But there are also some hidden gems that often go unnoticed. These tags can help make websites more engaging, accessible, and meaningful without much extra effort.
Stop Writing Extra Code: HTML Inputs Are More Powerful Than You Think
People often reinvent the wheel instead of using native HTML inputs. I understand that styling some of them can be a nightmare, but they can do more than a lot of people realize.
Highlighting Text in Links with Text Fragments
I’ve used URL text fragments in a few posts now and often use it outside of this blog to point someone to a particular piece of text on a page. They’re a really useful feature that allows you to create a URL that links not just to a page or an anchor on that page, but specifically to a bit of text that you’d like to call out to your audience.
The URL Fragment Text Directive is a W3C Draft, but has been around in at least some major browsers since 2020 and now has good support across Chrome, Edge, Safari, and Firefox as of this September. Firefox was the last straggler, with Safari joining the party in 2022.
JavaScript
Introducing your new JavaScript package manager: Deno
Deno’s new package manager, added in v2.0, is fast, flexible, and supports Node and package.json. Here’s how it works.
The Latest in Angular Change Detection – All You Need to Know
In Angular, change detection is especially controversial, mainly due to the “magical” nature of the change detection mechanisms backed by Zone.js. Recently, this area has undergone significant updates, particularly with the introduction of signals and the ability to opt out of using Zone.js. Let’s explore how these changes have unfolded.
JavaScript Import Attributes (ES2025)
JavaScript is getting a new feature that makes module imports more explicit and secure. Import Attributes add a way to pass metadata about any module we’re importing - whether it’s JSON, JavaScript, or other module types.
Tremor – React components to build charts and dashboards
35+ fully open-source, accessible components for dashboards and charts. Built with React, Tailwind CSS and Radix UI.
Tower game in 84 lines of pure JavaScript
The point of this game is to stack as many boxes on top of one another as possible. When you click on the screen, the bouncing box starts to fall. Unless you click in the exact moment when the two boxes are ideally aligned, the part of the box that is sticking out falls off the screen ("debris") and the next box has less room for landing. To make things even harder, each box bounces faster than the previous one.
The full source code is at the bottom of the page.
Motion - A modern animation library for JavaScript and React
Motion is built on native browser APIs for a tiny filesize and superfast performance. It uses hardware acceleration for smooth and eco-friendly animations. Previously Framer Motion.
Algorithms Behind JavaScript Array Methods
Let me break down the common algorithms used for each JavaScript array method.
Recording Videos Using JavaScript And Browser APIs
Learn how to record videos using the MediaStream Recording API.
Super Mario Bros. 3 physics code converted into JavaScript
Super Mario Bros. source code related to player movement implemented into more readable JavaScript.
Miscellaneous
Are Devs Becoming Lazy? The Rise of AI and the Decline of Care
With the rise of AI-powered tools like GitHub Copilot, software development is entering a strange new era. Coding used to be about craftsmanship, precision, and knowing your tools inside and out. Now? It’s starting to feel more like watching a machine do the heavy lifting while we just click “accept.” While these tools promise to boost productivity, they’re also giving developers an easy way to sidestep the messy details, the security checks, the… real work. So, here’s the big question: Are we witnessing a new age of "lazy" developers?
How to Use AI Without Losing Coding Skills
AI-powered coding assistants like GitHub Copilot and Cursor are transforming the development landscape, and let's be honest—they're addictive. With just a few keystrokes, you can have entire blocks of code written for you, auto-completed syntax, and suggestions that make tedious work feel like a thing of the past. But here's the catch: Is all this convenience making us worse developers?
You are not your job
- It’s not a family
- You’re not a metamate, pinployee, coinbae, splunker, twilion, googler, amazonian
- There’s likely a better job out there for you, possibly a better entire career
- You might like your co-workers, but that’s not because of the job or the organization
- All jobs are temporary. You’ll likely have five more after this one. Maybe you’ll retire. You’ll at least die
- You should maximize your income while minimizing efforts that take you away from living your life
The engineering career mobility report: Who gets promoted?
This report aims to shed light on the concept of career mobility for engineers, providing a comprehensive analysis of key transitions, trends, and insights drawn from SignalFire’s vast dataset.
The insights in this report are crafted for engineering professionals of all levels—from junior developers to seasoned leaders. We believe that understanding the patterns of career mobility will not only empower individual engineers to make more strategic decisions but also help engineering leaders optimize talent management, mentorship, and team structures.