Create Responsive Image Effects with CSS Gradients and aspect-ratio — A classic problem in CSS is maintaining the aspect ratio of images across related components, such as cards. The newly supported aspect-ratio property in combination with object-fit provides a remedy to this headache of the past.

Stephanie Eckles

What The Heck, z-index? — Another great post from Josh, this time exploring stacking contexts and the often tricky z-index property.

Josh W Comeau

The Definitive Guide to Feature Management — Feature management is a new class of software development tools/techniques powered by feature flags. A feature management platform like LaunchDarkly fills the gaps of conventional feature toggles. Learn the ins & outs of feature management today.

LaunchDarkly sponsor

Firefox 86 Introduces 'Total Cookie Protection' — The goal of ‘total cookie protection’ is to confine cookies solely to the site where they were created, rather than letting tracking companies use them to track your activity across the Web. It essentially gives you a separate ‘cookie jar’ per site. Firefox 86 also adds multiple picture-in-picture support.

Mozilla Security Blog

Getting Deep into Shadows — Turns out there’s a lot to cover when it comes to all the ways in which you can use shadows in web design. This post explores them.

Rob O'Leary

Time for Next-Gen Codecs to Dethrone JPEG — A look at how several next-gen image codecs (JPEG 2000, WebP, AVIF, and JPEG XL) compare to JPEG in compression density, features, etc.

Jon Sneyers

Learn How Publicis Sapient use GatherContent to Massively Speed Up Site Builds — Learn how they used GatherContent to achieve this and start your free 30-day trial to get your own POC live in an hour.

GatherContent sponsor

How to Publish an Angular, React, Svelte, or Vue JavaScript app with Azure Static Web Apps — A multi-step tutorial on deploying a modern JavaScript app to Azure Static Web Apps, Azure’s platform for building and deploying static apps from a GitHub repository.

John Papa (Microsoft)

Three Ways to 'Blob' with CSS and SVG — Making smooth, random, jelly-like shapes to illustration elements, background effects, etc.

Akash Mittal

Technology Lead (Calgary, Canada) — We’re a digital experience design agency seeking a senior tech lead. Help us deliver on fast paced, creative campaigns with your knowledge of HTML, CSS, jQuery and JavaScript, building accessible, scalable, and performant web apps.

Critical Mass

Front End Developer (Calgary, Canada) — We’re seeking an experienced frontend dev to join our design agency. Use your jQuery, HTML and CSS skills to help us develop cutting-edge responsive websites.

Critical Mass

Find Your Next Job Through Hired — Create a profile on Hired to connect with hiring managers at growing startups and Fortune 500 companies. It's free for job-seekers.

Hired

PixelCraft: A Pixel Art Editor — Tool installable as a PWA with offline use to build pixelated graphics and GIF animations (maybe useful for retro graphics). You can try it here.

Gabriel

SVG Waves: Instantly Generate and Customize Wave Shapes — Similar to another tool we recently featured, this one allows you to add draggable nodes to modify the shape of the waves before grabbing the SVG or CSS.

Bereket Semagn

fullPage.js: Create Fullscreen Scrolling Sites — Available in Vue, React, and Angular flavors too. (GPL 3.0 licensed.) GitHub repo.

Álvaro Trigo

How 4 Figma Features Transformed Stream’s Design Workflows

Stream sponsor

disableautofill.js: Disable Form Auto-Fill and Auto-Complete Functions — You need to be very careful about where you use things like this due to its effect on assistive tools.

Terry Lin

Glassmorphism: Generate CSS for a "Frosted Glass" Effect — An online code generator to build a ‘frosted glass’ look for page elements. The CSS combines RGBA transparency with shadows and backdrop-filter, a relatively new CSS property.

Albert Walicki

Vue3 Icon Picker: An Beautiful Icon Picker Component for Vue — Try a demo here. The example is using Font Awesome and this is ported from a Vanilla JS version.

Hasin Hayder