Frontend Focus 🚀

PlaceCats - Purr-fect Placeholders Free, fast, and adorable cat placeholders for your design projects. Supports resizing, fit/position adjustments, and grayscale.

😻 Place Cats: Image Placeholders for Your In-Progress Projects - https://placecats.com/

How to scale elements and their layout with CSS "zoom" The CSS zoom property, unlike scale, affects an element's layout size, not just its visual appearance.

How to scale elements and their layout with CSS "zoom": https://www.stefanjudis.com/today-i-learned/css-zoom-to-scale-elements/

A Complete Guide to Bookmarklets | CSS-Tricks Browsers don't just let you bookmark web pages. You can also bookmark JavaScript, allowing you to do so much more than merely save pages.

A Complete Guide to Bookmarklets: https://css-tricks.com/a-complete-guide-to-bookmarklets/

Learn Visual Studio Code A collection of 150+ tips and customizations on using Visual Studio Code, the world's most popular code editor. These tips are almost entirely based on built-in features of VS Code – no extensions or external tools needed. You'll learn how to customize VS Code's UI, find and change settings you didn't know existed, use little-known features, and lots more.Includes more than 150 tips across 346 pages (PDF version; EPUB is more variable in page length) with 450+ full-color, high-resolution screenshots and captions with clear instructions on every feature discussed. Nearly all features and screenshots are up to date with the latest version of VS Code as of January 2026.There are tips in here for beginners, but most of the tips are little-known features that even advanced users don't know about. It doesn't matter if you're a Mac or Windows user, almost all the content is applicable to both operating systems. Much of the code examples are focused on front-end technologies (JS, HTML, CSS, TypeScript, etc.) but the concepts are applicable to any language used inside VS Code.Lots of unique content is covered, including: Using the Settings UI Little-known Terminal Tips The Code Snippets feature Editing Keyboard Shortcuts Using Zen Mode VS Code Workspaces Working with Profiles Extension Trust & Security Managing Tabs & Windows Customizing Labels & Buttons Using IntelliSense Accessibility Tips ... and lots more! Some of the content includes links to animated GIFs so you can see the tip or customization in action. The GIFs aren't necessary to understand the content, but they are helpful if you're reading online. Check out a couple of sample pages below!

Learn Visual Studio Code: https://lazarpress.gumroad.com/l/learnvscode

Sprites on the Web • Josh W. Comeau In game development, it’s common to use spritesheets for animation, but this technique isn’t as widely used on the web. Which is a shame, because we can do some pretty cool stuff with sprites! In this post, we’ll share the niche CSS function you can use to leverage this technique, and explore some of the potential use cases.

Sprites on the Web: https://www.joshwcomeau.com/animation/sprites/

The Four New Color Palettes added to Tailwind CSS v4.2 Mauve, olive, mist, and taupe join the default palette — all offer a swatch of tinted neutrals.

The Four New Color Palettes added to Tailwind CSS v4.2: https://superhighway.dev/tailwind-v4-2-new-palettes

GitHub - Toheeb/base: The web's first multipurpose classless stylesheet, with the most semantic rules, for complete customization and personalization of a webpage. The web's first multipurpose classless stylesheet, with the most semantic rules, for complete customization and personalization of a webpage. - Toheeb/base

Base.css: A Multi-Purpose, Classless Stylesheet With Semantic Rules - https://github.com/Toheeb/base

PWAscore - PWA Browser Scorecards Compare Progressive Web App support across popular mobile (and soon, desktop) browsers.

PWAscore: Compare Progressive Web App Capabilities Across Popular Mobile Browsers - https://pwascore.com/

Everything you never wanted to know about visually-hidden The one where I attempt to answer a question

Everything You Never Wanted to Know About `visually-hidden`: https://dbushell.com/2026/02/20/visually-hidden/

The Four New Color Palettes added to Tailwind CSS v4.2 Mauve, olive, mist, and taupe join the default palette — all offer a swatch of tinted neutrals.

The Four New Color Palettes added to Tailwind CSS v4.2: https://superhighway.dev/tailwind-v4-2-new-palettes

Underlining Links With CSS A practical guide to styling link underlines with modern CSS text-decoration properties. Perfect for bookmarking when you need a quick reference!

Underlining Links With CSS: https://www.alwaystwisted.com/articles/underlining-links-with-css

Sprites on the Web • Josh W. Comeau In game development, it’s common to use spritesheets for animation, but this technique isn’t as widely used on the web. Which is a shame, because we can do some pretty cool stuff with sprites! In this post, we’ll share the niche CSS function you can use to leverage this technique, and explore some of the potential use cases.

Sprites on the Web: https://www.joshwcomeau.com/animation/sprites/

Loading Smarter: SVG vs. Raster Loaders in Modern Web Design | CSS-Tricks Let’s get nuanced in this article and discuss the capabilities of both SVG and raster imaged so that you can make informed decisions in your own work.

Loading Smarter: SVG vs. Raster Loaders in Modern Web Design - https://css-tricks.com/loading-smarter-svg-vs-raster-loaders-in-modern-web-design/

An in-depth guide to customising lists with CSS Richard Rutter helps you to make sense of list-style, list-item, ::marker, counters(), counter(), @counter-style, symbolic, symbols(), symbols and more to push your HTML and CSS lists to the next level.

An In-Depth Guide to Customizing Lists With CSS: https://piccalil.li/blog/an-in-depth-guide-to-customising-lists-with-css/ (Richard goes deep, with code examples aplenty. You'll probably come away having learnt something here.)

Auf YouTube findest du die angesagtesten Videos und Tracks. Außerdem kannst du eigene Inhalte hochladen und mit Freunden oder gleich der ganzen Welt teilen.

Interop 2026: Browsers Are Finally Catching Up - https://www.youtube.com/watch?v=UVIeyRE6zLU

Native HTML components don’t guarantee good UX Adam Silver – interaction designer - London, UK

Native HTML Components Don’t Guarantee Good UX: https://adamsilver.io/blog/native-html-components-dont-guarantee-good-ux/

A Designer’s Guide To Eco-Friendly Interfaces — Smashing Magazine Every high-resolution hero image, autoplay video, and complex JavaScript animation carries a cost. Sustainable UX challenges the era of “unlimited pixels” and reframes performance as responsibility. In 2026, truly sophisticated design is defined not by how much it adds, but by how thoughtfully it reduces its footprint.

A Designer’s Guide To Eco-Friendly Interfaces: https://www.smashingmagazine.com/2026/02/designer-guide-eco-friendly-interfaces/

Standard HTML Video & Audio Lazy-loading is Coming! | Scott Jehl, Web Designer/Developer A quick update on my team's work to bring video and audio lazy loading to browsers today

Standard HTML Video & Audio Lazy-loading is coming: https://scottjehl.com/posts/lazy-media/

Abstract geometric artwork with big white dots on black background.

Abstract circular geometric white dots on black.

Abstract black arrows in circles, on white background.

Abstract thin dotted line graphics.

You'll never guess how I made these illustrations!

(pssst: I'm using CSS gap decorations)

Check out the source code ➡️ patrickbrosset.com/lab/gap-deco...
⚠️ This currently requires a recent Chromium browser.

The Four New Color Palettes added to Tailwind CSS v4.2 Mauve, olive, mist, and taupe join the default palette — all offer a swatch of tinted neutrals.

Here's a quick look at the four new color palette options recently added to Tailwind CSS.

New issue later today!

sugarcube • sugarcube Design tokens, generated CSS, and optional components. Build front ends on strong, reusable foundations.

Introducing the 'sugarcube' Toolkit: https://sugarcube.sh/

GitHub - keithamus/invokers-polyfill Contribute to keithamus/invokers-polyfill development by creating an account on GitHub.

Invoker Buttons Polyfill: A Polyfill for the Newly Supported `command` and `commandfor` HTML Attributes - https://github.com/keithamus/invokers-polyfill

A Broken Heart Or, getting a 100x speedup with one dumb line of code.

How a 💔 Broken Heart made a page 100x slower in Safari: https://allenpike.com/2026/a-broken-heart/

Announcing Interop 2026 Exciting news for web developers, designers, and browser enthusiasts alike — Interop 2026 is here, continuing the mission of improving cross-browser interoperability.

Interop 2026 launches today! If you want know on what it includes and what it means for web development — our article provides all the details. webkit.org/blog/17818/a...

Focus areas include Anchor Positioning, Style Queries, contrast-color(), WebTransport and much, much more.

State of JavaScript 2025 The 2025 edition of the annual survey about the latest trends in the JavaScript ecosystem.

State of JavaScript 2025: https://2025.stateofjs.com/en-US/

A Broken Heart Or, getting a 100x speedup with one dumb line of code.

How a 💔 Broken Heart made a page 100x slower in Safari: https://allenpike.com/2026/a-broken-heart/

A Guide to Browser DevTools - The Network Monitor Learn how to use the browser DevTools Network tab to inspect requests, debug APIs, and analyze page performance.

A Guide to Browser DevTools: The Network Monitor: https://spin.atomicobject.com/devtools-network-monitor/

The Browser Hates Surprises – Frontend Masters Blog To avoid page loading jank, there are things we can do to avoid content from shifting around, even if repainting is still necessary.

The Browser Hates Surprises: https://frontendmasters.com/blog/the-browser-hates-surprises/

Interop 2025: A year of convergence Interop 2025 has come to a close, and the results speak for themselves.

Interop 2025: A Year of Convergence - https://webkit.org/blog/17808/interop-2025-review/