Page 9 - Tailwind 4

AI generated

Tailwind CSS with Laravel Blade: Components, @props and Vite Integration

Maxim Mironjuk - May 31, 2025

Laravel Blade brings its own composition system for server rendered views through components, attribute bags and @props, and Tailwind CSS adds a consistent utility system for styling on top. Setting up Tailwind CSS cleanly in Laravel Blade projects gives you reusable components, a lean Vite build pipeline and a CSS bundle that only contains the classes actually in use.

Tailwind Web Performance

AI generated

Tailwind CSS Aspect Ratio: Embedding Responsive Media Correctly

Maxim Mironjuk - May 30, 2025

A video embed without a fixed aspect ratio shifts the entire layout while it loads, and it costs Core Web Vitals points. Tailwind CSS's aspect-ratio utilities solve this problem cleanly, responsively and without a padding hack. This article shows every pattern, from 16:9 to fully custom ratios.

Tailwind CSS

AI generated

Tailwind group and peer: selectors for interactive UI without JavaScript

Maxim Mironjuk - May 18, 2025

Hover cascades, form validation and complex UI states: with Tailwind's group and peer modifiers you can describe interactions that other projects reach for Alpine.js or React to build. The result is lean HTML with zero JavaScript overhead.

Tailwind Web Performance

AI generated

Auditing Unused Tailwind Classes: Content Scanning and Bundle Hygiene

Maxim Mironjuk - May 13, 2025

Tailwind's content scanning promises that only actually used classes end up in the final CSS. In practice, unused Tailwind classes still accumulate, through removed components, oversized safelists, and dynamically composed class names that scanning can never classify as safe in the first place.

Tailwind CSS

AI generated

Arbitrary Values in Tailwind: Best Practices and Anti Patterns

Maxim Mironjuk - May 03, 2025

Arbitrary values open Tailwind up to any conceivable CSS value, without ever having to fall back to @apply or a separate stylesheet file. Used correctly, they elegantly solve genuine one off cases. Used incorrectly, they turn a clean utility system into unreadable class lists and undermine purge, consistency and team understanding.

JavaScript Tailwind

AI generated

Build Time Optimization for Tailwind CSS in Monorepos

Maxim Mironjuk - April 28, 2025

Anyone running Tailwind CSS in a monorepo with many packages knows the problem: the build process goes from seconds to minutes once the content configuration scans too many files. With targeted globs, Turborepo caching, Nx task pipelines, and parallelization, build time can be kept consistently low even across hundreds of packages.

Tailwind Web Performance

AI generated

Tailwind Hero Sections: 10 Variants for Strong Landing Pages

Maxim Mironjuk - April 28, 2025

The hero section decides in the first three seconds whether a visitor stays or leaves. This article shows ten concrete Tailwind CSS hero variants, from simple gradients to video backgrounds and glassmorphism, with complete code and design rationale.

Tailwind CSS

AI generated

Tailwind CSS Dark Mode Strategy: class, media and @variant in v4

Maxim Mironjuk - April 25, 2025

Dark mode in Tailwind CSS is more than a dark: prefix in front of every class. A well thought out dark mode strategy combines system synchronization, user preference persistence, CSS custom properties and a flicker-free toggle, from v3 all the way to the new @variant capabilities in v4.

JavaScript Tailwind

AI generated

Tailwind CSS with htmx: Styling Hypermedia Applications

Maxim Mironjuk - April 17, 2025

htmx brings AJAX, swap transitions and server-side rendering back into simple HTML attributes, and Tailwind CSS supplies the matching utility-first styling without a separate frontend build. This article shows how loading states, transitions between swaps and dynamically loaded fragments get styled consistently, without needing a complete JavaScript framework.

Tailwind CSS

AI generated

Smooth Theme Transitions with the View Transitions API in Tailwind CSS v4

Maxim Mironjuk - April 16, 2025

A theme switch that simply swaps a class is technically correct but feels abrupt. With the View Transitions API, color variables registered through @property, and a slim Alpine.js store, the same switch becomes a soft cross fade in Tailwind CSS v4, without adding a separate JavaScript library.