Make creative borders with background-clip border-area

Make creative borders with background-clip border-area

How’d you like to use CSS to easily create a border from an image or gradient?

Read more

Help us choose the final syntax for Masonry in CSS

Help us choose the final syntax for Masonry in CSS

Back in April 2024, we wrote about “Masonry” layout in CSS and the ongoing work to bring this feature to browsers.

Read more

Help us invent CSS Grid Level 3, aka “Masonry” layout

Help us invent CSS Grid Level 3, aka “Masonry” layout

UPDATE October 2024: Since this article was published, members of the CSS Working Group have concluded that all of the grid abilities described here — variable-width tracks, explicit placement, spanning, and subgrids — are worth including in masonry layout, and are possible to implement performantly.

Read more

Implementing Vertical Form Controls

Implementing Vertical Form Controls

Safari 17.4 adds vertical writing mode support for form control elements across macOS, iOS, iPadOS, and visionOS.

Read more

CSS Nesting and the Cascade

CSS Nesting and the Cascade

You might have noticed that Safari Technology Preview 179 includes an update to CSS Nesting that adds support for the new “relaxed parsing behavior”.

Read more

Try out CSS Nesting today

Try out CSS Nesting today

Back in December, we wrote an article detailing three different options for CSS Nesting.

Read more

Help choose the syntax for CSS Nesting

Help choose the syntax for CSS Nesting

The CSS Working Group is continuing a debate over the best way to define nesting in CSS.

Read more

Using :has() as a CSS Parent Selector and much more

Using :has() as a CSS Parent Selector and much more

It’s been a long-standing dream of front-end developers to have a way to apply CSS to an element based on what’s happening inside that element.

Read more

Customizing Color Fonts on the Web

Customizing Color Fonts on the Web

Color fonts provide a way to add richness to your designs without sacrificing any of the many benefits of using plain text.

Read more

The Focus-Indicated Pseudo-class :focus-visible

The Focus-Indicated Pseudo-class :focus-visible

The “focus indicator”, as its name suggests, visually indicates (often with a kind of an outline) that an element has focus.

Read more

Wide Gamut 2D Graphics using HTML Canvas

Wide Gamut 2D Graphics using HTML Canvas

Support for creating 2D canvases with Display P3 backing stores has been added to WebKit.

Read more

CSS Individual Transform Properties

CSS Individual Transform Properties

CSS Transforms appeared on the Web along with CSS Animations and CSS Transitions to add visual effects and motion on the Web.

Read more