#CSS
17 related articles
Goodbye clamp() Magic Numbers: Fluid Typography with the CSS progress() Function
The CSS progress() function is now Baseline. Replace clamp()'s magic numbers with normalized progress values for readable, maintainable fluid typography, plus custom property techniques and a tan(atan2()) fallback.
The Future of CSS: How Interop and New Features Are Reshaping Front-End Development
An analysis of Josh W. Comeau's take on the future of CSS: how the Interop project drives browser compatibility, the real impact of container queries, :has(), cascade layers, and native nesting, plus contrasting views from Hacker News.
Invoker Commands: A New Declarative HTML Alternative to JavaScript
In-depth analysis of Invoker Commands: declaratively open dialogs and popovers in pure HTML, no JavaScript needed. Covers Interest Invokers hover previews, custom commands, browser support, and polyfill guide.
Pure CSS Recreation of the GTA6 Website Scroll Effects: Scene Transitions and Gradient Text Explained
Recreate the GTA6 website scroll effects with pure CSS — learn how view-timeline, animation-range, and @property power scene cross-fades, subtle zoom, and flowing gradient text.
View Transitions Major Update: Cross-Browser Support and Four New Features Explained
CSS Podcast details View Transitions updates: cross-browser support in Chrome/Safari/Firefox, view transition types, match-element, nested groups, and scoped transitions.
CSS Developer Preferences Unpacked: Adam Argyle on His Favorite Colors, Units, and Properties
CSS expert Adam Argyle shares his favorite colors, formats, properties, and units in a rapid-fire Q&A, with community votes revealing OKLCH's rise, display and rem dominating, and grid still stumping developers.
Pure CSS Card Expand Animation: A Deep Dive into details and Modern CSS Techniques
Build smooth card expand animations with pure CSS — no JavaScript needed. Learn how details, ::details-content, interpolate-size, and @starting-style work together.
Stop Using JavaScript: 6 Underrated Modern CSS Features
Kevin Powell highlights 6 modern CSS features — scroll-margin, scroll-snap, :user-valid, focus-visible, lh unit, and field-sizing — that replace JavaScript with one or two lines of code.
Two New CSS Features: Say Goodbye to Magic Numbers in Textarea Styling
Two new CSS features for cleaner textarea styling: the lh unit ties height to line count so font-size changes never break your layout, and field-sizing:content auto-expands textareas without JavaScript.
Getting Started with Shadow DOM: Understanding CSS Shadow Roots Through Interactive Examples
Simon Willison generated an interactive Shadow DOM teaching tool using a single AI prompt. Explore how CSS Shadow Roots work, style isolation, ::part, ::slotted, and event retargeting.
Fixing Fluid Typography: Combining Container Queries with @property
Fix fluid typography issues — font sizes growing past max-width containers and inconsistent sizes across multiple containers — using container query units and @property.
The Most-Used CSS Units in Production Websites — Ranked
Production CSS unit rankings revealed: px leads, em beats rem with 91.3% coverage, and degrees and seconds crack the top four. Here's what the data actually means.
Has the CSS Zen Garden Dream Finally Come True? Revisiting the Separation of Content and Style
A Hacker News post claims the CSS Zen Garden dream has finally shipped. We revisit the history of content-style separation and how modern CSS has — and hasn't — fulfilled that vision.
TutorialsAfter Leaving Tailwind, These CSS Color Palette Tools Are Worth Bookmarking
After returning to vanilla CSS from Tailwind, how do you choose a good color system? This article covers community-recommended CSS palette solutions including Reasonable Colours, Flexoki, uchū, and generator tools like tints.dev.
TutorialsCSS text-shadow Smooth Rendering Optimization: Say Goodbye to Jagged Edges and Unlock Text Effect Potential
Major browsers have optimized the CSS text-shadow rendering engine for sub-pixel smoothing and GPU acceleration. Learn the improvements, neon effects, and performance best practices.
TutorialsHTML Description List <dl> Element: 4 Things You Didn't Know & Best Practices
Deep dive into 4 little-known facts about the HTML <dl> element: multiple dd per dt, div wrapping rules, ARIA accessibility enhancements, and screen reader support status with best practice guidelines.
Expert OpinionsWhy Is CSS So Hard? Julia Evans' Deep Reflection
Julia Evans reflects on relearning CSS after migrating from Tailwind, revealing that CSS is complex because it solves inherently complex problems. Explore why CSS is underestimated and how modern CSS has evolved.