Web

Геометрические фигуры в CSS-анимации

Хабр, привет! Я во фронтенде настолько давно, что учился верстать по текстовым туториалам. В начале десятых годов я и все мои знакомые фронтендеры обя…

Frontend Status: свежий дайджест фронтенда и AI — 27.04.2026

Привет! Это четырнадцатый выпуск Frontend Status — дайджеста по фронтенд-разработке. В этом выпуске: 📺 Vue на развилке роста: разбираем State of Vue 2…

Compositing & Blending

Web Design Trends 2026: The Complete Guide for Developers

The top web design trends shaping 2026 — with CSS code examples for each. 1. Bento Grid Layouts Asymmetric CSS Grid layouts inspired by Japanese bento…

How to Build Smooth Loading Animations Using Parametric Curves

Every frontend developer has been there. You need a loading indicator, so you reach for the same tired spinner CSS you've copy-pasted since 2018. It r…

Understanding Sizing in CSS Flexbox (A Practical Guide)

The first time I really tried to understand sizing in Flexbox, I got stuck. Not because I didn’t understand width and height .Not because I didn’t kno…

I ran a spacing audit on shadcn/ui. Even it had some drift.

Short post. Three things to share. The audit I ran Rhythmguard against the shadcn/ui v4 app. I expected drift. I did not expect what I actually found.…

Why I spent years trying to make CSS states predictable

Have you ever changed the order of two CSS rules and broken a component without changing the logic? .btn :hover { background : dodgerblue ; } .btn [ d…

Pixeliro Chrome Plugin Has Run Production

Check it: https://chromewebstore.google.com/detail/pixeliro-%E2%80%94-design-intelli/hnfochibcejkpjapbcpipkinaapeamda CSS color sniffer · Live theme i…

Olive CSS: Lisp powered vanilla CSS utility-class a la Tailwind

CSS для тех, кто спал и проснулся

За последние годы CSS сильно изменился: появились вложенность, новые селекторы, container queries и нормальная работа с темами. В этой …

Color Contrast Failures: The Number One Accessibility Issue and How to Fix It

Color contrast failures are the single most common accessibility issue on the web. The WebAIM Million study found them on 83.6% of home pages tested. …

Animating SVG Gradients with CSS Keyframes

This article is part of a series on CSS + SVG animations — the zero-JavaScript motion stack. Introduction Modern browsers have a powerful, underapprec…

How We Build High-Performance Animated Websites Without Killing Page Speed

Modern web users expect two things at the same time: smooth, delightful animations and instant page loads . The problem? Most teams accidentally sacri…

Here is Why ‘it works on My Machine’ Is a Communication Bug, not a Code Bug.

Tags: css, beginners, web dev, html Body : “It works on my machine.” That’s what I told my friend when I sent him my first website. On my laptop it wa…

Building a cinematic Sci-Fi Dashboard using 100% Vanilla JS & CSS (No React/Tailwind)

Hey DEV community! 👋 As a UI/UX Architect, I’ve noticed a frustrating trend in the B2B SaaS space, particularly in cybersecurity (SIEM, SOC, UEBA tool…

10 CSS tricks that feel illegal to know in 2026 🤫

🧊 Hey, quick story Last week I watched a senior dev write 47 lines of JavaScript. To center a div. He wasn't joking. look, CSS has changed. A LOT. Mos…

How to Create a Sparkly-Spoiler Effect like the one in Threads Mobile App

If you use Meta’s Threads app on a mobile device, you may have noticed an interesting effect: the spoiler tag that hides text behind a sparkly veil. I…

CSS Breakpoint Units - design with pixels and get fluid UX for free while automatically solving two of the oldest accessibility problems.

I've created many NPM packages and invented many hacks focused on helping us all easily create beyond what's typically considered possible. It drives …

Frontend Status: свежий дайджест фронтенда и AI — 18.04.2026

Привет! Это 13-й выпуск Frontend Status — дайджеста по фронтенд-разработке. В этом выпуске: 📺 Для тех, кто хочет делать игровые интерфейсы быстрее: ви…

I Built a Font Inspector Chrome Extension That Actually Identifies Japanese Fonts

There is a specific frustration that every frontend developer knows: you open a Japanese website, see a beautiful typeface, open DevTools, and font-fa…

I Built a Neumorphic CSS Library with 77+ Components — Here's What I Learned

What is SoftUI? SoftUI is a neumorphic CSS component library. Instead of flat design or material shadows, everything uses soft, diffused shadows that …

Building a Loader Animation with SVG + CSS Only

This article is part of a series on CSS + SVG animations — the zero-JavaScript motion stack. Introduction Modern browsers have a powerful, underapprec…

От #FFF к OKLCH: как эволюция цветовых моделей меняет веб-разработку

Помните времена, когда цвета в CSS выбирались почти наугад? Белый фон — #FFF , чёрный текст — #000 , акцент — какой-нибудь #3498db , который просто но…

Препарируем Vivaldi во имя науки и нескучных обоев

В ходе моего переезда с российского софта очередь дошла и до Яндекс Браузера, коим я пользовался с момента бета тестирования и очень пр…

Level up CSS transitions with cubic-bezier

This article was originally published on Rails Designer If you've ever noticed that your CSS transitions feel a bit… flat, you're not alone (I seem th…

CSS in a Team: How I Stopped Explaining Rules and Started Enforcing Them

I once led a team of 4 markup developers. First week, I opened a PR and found this: // developer A .card { z-index : 999 ; color : #fff ; padding : 13…

Building Charts with Pure CSS — No SVG, No Canvas, No JS Required

Most developers reach for a chart library the moment they need a visualization — Chart.js, Recharts, D3 — and suddenly their page is carrying a hefty …

The Rubik’s Cube of AI Technical Advances

The Rubik’s Cube of AI Technical Advances Takeaway: Thinking about AI progress as a Rubik’s Cube reveals why breakthroughs feel sudden, why limitation…

I got tired of class-heavy UI code, so I started building Juice

At some point I realized I was spending more time reading class strings than reading the UI itself. Not CSS. Not components. Just giant piles of utili…