Последние новости

A Free Random Color Generator I Built for Designers and Developers

Colors are one of those things that seem simple until you need one. "Just pick a nice blue" sounds easy, and then you spend forty minutes cycling th…

Dark Mode in Firefox: NightOwl vs Dark Reader, OS Integration, about:config, and Scheduling

Dark mode has gone from a niche preference to an expected feature. Firefox users have several options for enabling dark mode — from the OS-level set…

Customizing Firefox's New Tab Page: From Simple to Full Control

Firefox's new tab page has changed over the years. Here's what you can configure natively, and what extensions exist for more control. Firefox Home…

Width is not the viewport, and 800x600 is not a desktop

Development covered 29 Aug 2026 to 2 Sep 2026 (commit dates). Myriad Immortal Sect runs in a browser, and browsers are not one shape. It runs full s…

Understanding Aspect Ratios in CSS and Canvas: Formulas, Responsive Rules, and Image Cropping

When building responsive image galleries, hero sections, or interactive media canvases, aspect ratio mismatches are among the common causes of Cumul…

Stop exporting JSON tokens and use CSS variables instead

A designer tagged me in a Figma comment on Tuesday morning. They wanted to know if we could start exporting our brand tokens as deeply nested JSON f…

How to Improve Blogger Website Performance with Practical HTML and CSS Optimizations

How to Improve Blogger Website Performance with Practical HTML and CSS Optimizations A Blogger website can look beautiful and still perform poorly o…

Let the designer's spec be the test: a bounded UI change request for game UI

"The quest reward toast feels cramped and is hard to read on phones." That's a fair complaint, and a hard thing to hand to an engineer. "Cramped" an…

How we took CLS to 0.000 on a hand-built static site (no framework, no CDN)

Our production site is deliberately boring technology: hand-written HTML, one compiled CSS file per page, no framework, no build step, no CDN, share…

From BEM to BE.M — A CSS Naming Convention Built for Component Libraries

Originally published on LinkedIn . I'm gradually migrating my LinkedIn articles over to DEV — this is the first one. BEM was designed for page-level…

The iPhone Duo Web Checklist: 9 Things to Verify Before October 23

In September, a post titled "Dear God websites look horrible on iPhone Duo" climbed to the top of r/webdev. Two screenshots and one complaint: with…

Why HTML, CSS, and JavaScript Aren’t Dead Yet (Even with AI Writing Code)

If you spend any time on tech Twitter, LinkedIn, or YouTube lately, you’ve probably seen someone posting a 10-second video of an AI generating a ful…

CSS Flexbox

What Is CSS Flexbox? Flexbox stands for Flexible Box Layout . It is used to arrange elements in a row or column and control their alignment and spac…

CSS for underlines

Keep the focus ring: a keyboard check for landing pages

A landing page isn't finished when the buttons work with a mouse. Try reaching the same buttons without one. Press Tab from the top of the page. You…

Respect reduced motion (Web HIG tip #9)

A slide-in panel looks smooth to most people. For someone with a vestibular disorder, it can bring on dizziness or nausea. Their OS already has a "R…

Iframes that finally fit their content

5 Framer Motion patterns I used building 5 React templates (with code)

Over the last few weeks I built five website templates in React 18, Vite 5 and Framer Motion 11 — fashion, restaurant, SaaS, agency and wedding. No…

A Checkerboard Is Not Transparency: A Practical Alpha Test for Video

You export a “background-free” video, put it on a web page, and see a black rectangle. Is the file broken? Perhaps. But the player might be ignoring…

Theming a Drop-In UI Kit Without Forcing a Fork

Theming a Drop-In UI Kit Without Forcing a Fork Every prebuilt UI component library eventually meets a design system it was not built for. At that p…

Fluid Typography with CSS clamp(): Scale Text Smoothly Without Media Queries

Instead of setting a font size and overriding it at several breakpoints, you can let text scale smoothly with the viewport. CSS clamp() makes this a…

Application CSS must not use transition: all (Web HIG tip #6)

transition: all looks convenient until a new property starts animating and the UI jumps in ways you never meant. Web HIG tip #6 (Quick #85, HIG-MOT-…

Introducing overlapui.css — drop-in overlap stacks for any stack

You want stacked avatars, a peeking card pile, or a “+” that fans into actions — and you don’t want a JS component library or an FSCSS build step ju…

Your webhook handler was slow, so Shopify sent it again

The server reboots at two on a Saturday morning for a security update, which is what it's supposed to do. The app doesn't come back, because nobody…

How I turn any handful of colours into a readable theme

Open the theme picker, choose Flatland from the base16 list, and the cards on the page lose their edges. Text and links are fine, but every border a…

5 Questions Every Service-Business Website Should Answer Before a Customer Messages You

When someone lands on a service-business website, they usually are not there to admire the layout. They are trying to decide, quickly, whether this…

I removed my Chinese web font. Every page lost 1 MB

First published on yappatyih.com . TL;DR A system font stack is a list of fonts that are already installed on the reader's device, given to the brow…

The Case of the Missing `rem`: A Sherlock Holmes Guide to CSS Units in JavaScript

Being the record of an investigation into CSS units, JavaScript geometry, and a very small missing value — as written by Dr. Watson. A Matter of No…

We audited every new page at 320px, and the console snippet that should have run first

CogniPrep has been shipping a long content release: 28 assessment providers' worth of practice tests, 26 tests in the final wave alone, and the publ…

FSCSS Shorthands: the full reference (1.2.5+)

FSCSS 1.2.5 adds property shorthands : compile-time rewrites that turn short property names into standard longhand CSS before the stylesheet ever re…