A New Comprehensive Project Management Tool from Notion — Execute plans with speed and clarity with Notion's powerful new project management tools - the first with AI assist. Take notes, manage tasks, set goals, collaborate, and stay connected.

Notion sponsor

New CSS Color Spaces and Functions in All Major Engines — All three major browser engines now support the new CSS color spaces and functions — normalized ways to access colors within any RGB color space.

Rachel Andrew

An Introduction to @scope in CSS — A quick primer on how you can style based on proximity or by setting a lower boundary for a selector.

Ollie Williams

Magical Rainbow Gradients — The human eye is particularly sensitive to movement in the field of vision — so you can use this technique that Josh shares here (by way of CSS Houdini and React Hooks) to add a dash of eye-catching action to an otherwise static element on your page.

Josh W. Comeau

How to Develop a Super App Using Open-Source Library Re.Pack — Sign up for a training program that will help you learn how to deliver features faster in complex teams or products.

Callstack sponsor

Sharing WebSocket Connections Between Tabs and Windows — If your users open your app in multiple tabs or windows, being able to share a WebSocket connection could be a lot more efficient both at the client and server end. Is it possible? With SharedWorkers (supported by all major browsers except Chrome on Android), yes.

Szymon Chmal

Testing Sites and Apps with Blind Users: A Cheat Sheet — Things to consider for users of screen readers, often those with low vision and blindness.

Shestopalov & Shykiriavyi

Watch Out for Layout Shifts with ch Units — Since ch units (most commonly the width of a '0' character) are based on your current font, their value can change when fonts are loaded, resulting in unexpected layout shifts.

Paul Hebert

Re-Evaluating px vs em in Media Queries — We used to say ems were the best unit to use in media queries. Is that still the case in 2023?

Keith J. Grant

Hiber3D Development Kit: A JavaScript Library for Creating Web-Based 3D Experiences — Optimized for performance and includes built-in multiplayer, character controls, gameplay mechanics, React components, and an asset library of 500+ available “prefabs”. See examples here.

Hiber3d

NakedJSX: Use JSX without React — If you like JSX and would like to use it to help in the production of static HTML without using React itself, this command line tool is for you. It even extracted scoped CSS classes and deduplicates them.

David Hogan

Breakpoints and console.log Is the Past, Time Travel Is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, jest, karma, jasmine, and more.

Wallaby.js sponsor

Materialize: A Responsive Frontend Library Based on Material Design — More specifically, this is a 'community fork' of Materialize.css, an older unmaintained project, and includes quite a few components despite being listed as an ‘alpha’ release.

Materialize

Faker.js UI: Easily Generate Fake (but Realistic) Data for Testing and Development using Faker.js — You can try the interface here. Search for a specific data type and use the “Generate Bulk” option for each type to quickly spit out whatever amount of data you need.

Joff Tiquez

ColourGPT: Use AI to Generate a Colour Palette Based on a Description — Type the number of colors you want and some keywords, for example, “7 colors like the blue sky” or “5 colors in scarlet red”.

Bruce Röttgers