Styling form inputs(checkbox, radio, range, and progress) with accent-color

The new CSS accent-color property is capable of editing the accented color of form controls provided by the browser’s default styles with a custom color value. In this article we’ll take a look at what it does and how to use it alongside color-scheme for simple, accessible checkboxes and radio button.

Evaluating Media queries in a Range Context

Media Queries Level 4 specification has introduced a new syntax for writing media queries that have a range type. We can now use common mathematical comparison operators like <, >,<=, >= instead of min/max prefixes.

Two new properties in CSS - overflow:clip and overflow-clip-margin

overflow: clip and overflow: hidden both do the same job of hiding content that overflows. However, overflow: clip also disables programmatic scrolling. Another property overflow-clip-margin controls how far from the element's edge the clipping begins.

Meet the most awaited CSS container queries

CSS container queries are similar to media queries, but related to a container element size rather than the viewport size.

Understanding CSS Feature Queries

CSS Feature Queries are a relatively new addition to the CSS specification, and provide a powerful tool for detecting support for various CSS features in the user's browser.

Taking control of scroll with CSS Overscroll Behavior and Scroll Snap

Improve the scroll bar behavior with CSS properties 'overscroll-behavior' and 'scroll snap'.

Rails 7 added --css app generator

Rails 7 added --css app generator for configuring CSS processors.

CSS custom properties

Custom properties give us the ability to set properties at the central place, which can be used whenever required.