Page 5 - CSS

AI generated

Theme Generator: Compiling JSON Design Tokens into @theme Blocks Automatically

Maxim Mironjuk - February 19, 2026

A manually maintained @theme block spirals out of control once the same color values are also needed for native apps, Figma, or a second frontend. A theme generator reads a single JSON token file as the single source of truth and automatically produces the Tailwind CSS v4 @theme block from it, consistent across every platform.

CSS Barrierefreiheit

AI generated

appearance: none for Custom Select Boxes: The Complete Guide

Maxim Mironjuk - February 18, 2026

The native browser arrow of a select element rarely matches a carefully considered design system, and appearance: none removes exactly that one visual detail, without impairing built in keyboard control, type ahead search, or screen reader announcement. Anyone who uses this technique correctly saves the entire rebuild of a dropdown in JavaScript.

CSS Design Patterns

AI generated

BEM, Utility First and CSS Modules Compared in 2026

Maxim Mironjuk - February 10, 2026

Choosing the right CSS methodology determines maintainability, onboarding time and refactoring cost for years to come. BEM, Utility First and CSS Modules solve the same core problem, naming collisions and uncontrolled cascade, with fundamentally different trade offs in readability, build complexity and team discipline.

CSS Barrierefreiheit

AI generated

:has() for Form Validation: Styling Parent Elements Precisely

Maxim Mironjuk - February 09, 2026

For decades, CSS could not select a parent element based on the state of one of its children. The :has() selector closes exactly this gap and makes form wrappers, fieldsets and entire form sections reactive to :invalid, :user-invalid and :checked, with not a single line of JavaScript.

Tailwind CSS

AI generated

Tailwind CSS Multi-Brand Theming: One Codebase, Many Brands

Maxim Mironjuk - February 07, 2026

White-label products, multi-tenant SaaS and agencies with many clients face the same challenge: how do you serve multiple brands from a single codebase without duplicating class names and without complicating the build process? Tailwind CSS multi-brand theming with @theme and CSS custom properties is the answer.

CSS

AI generated

is() and where() for Deliberate Specificity Control

Maxim Mironjuk - February 04, 2026

is and where are usually introduced as a plain shortcut for long selector lists, yet their biggest value lies in specificity control. where() creates zero specificity for resets and design systems, is() inherits the highest specificity of its argument, without developers having to spell out every combination manually.

CSS

AI generated

CSS Writing Modes: Vertical Layouts, CJK Typography and RTL/LTR

Maxim Mironjuk - February 02, 2026

CSS Writing Modes go far beyond vertical typography. They define the entire coordinate system in which the inline axis and block axis live, and with it, how margins, paddings, widths and flows behave correctly in RTL, LTR and vertical layouts without relying on physical properties.

JavaScript CSS

AI generated

Building Spring-Like Easing Functions: linear() Instead of Spring Libraries

Maxim Mironjuk - January 30, 2026

Real spring physics in animations used to be the domain of JavaScript libraries like Framer Motion or React Spring. The CSS function linear() now allows arbitrarily complex easing curves, including overshoot and bounce, to be defined directly as a list of control points in the stylesheet, with zero runtime JavaScript.

CSS

AI generated

font-variant-alternates: OpenType Features for Typographic Refinements

Maxim Mironjuk - January 28, 2026

Every professional font file holds far more than a single character set: ligatures, alternate glyphs, small caps and stylistic sets already sit ready inside the font file, but stay unused until something addresses them through CSS. font-variant-alternates and its sibling properties make exactly that possible, without JavaScript and without loading extra font files.

CSS Barrierefreiheit

AI generated

light-dark(): The CSS Function for Color-Scheme-Dependent Values

Maxim Mironjuk - January 27, 2026

With the light-dark() function, a light and a dark mode color value can be specified in a single declaration, instead of maintaining two separate prefers-color-scheme blocks. The browser automatically picks whichever of the two values applies based on the currently active color-scheme, both for system preference and for a manual toggle that overrides it.