~frontendfocus | Bookmarks (6)

Infinite-Scrolling Logos in Flat HTML and Pure CSS — Remember the long-deprecated HTML <marquee> element? If you need a horizontal auto-scrolling solution nowadays, you’ll no doubt turn to CSS. This post demonstrates one technique that uses as little HTML as possible.

Setting and Persisting Color Scheme Preferences with CSS and a “Touch” of JavaScript — Done via a combo of prefers-color-scheme, :has(), and JavaScript localStorage.

Modern CSS Tooltips and Speech Bubbles — Everyone knows what tooltips are, but despite their ubiquity, there’s no single, universal way to create them. The author of this post presents some modern techniques to create tooltips with the smallest amount of markup while retaining the most flexibility.

CSSformalize: A CSS Framework for Effortless Customization of Native HTML Forms — Offers an interactive UI to allow you to set your CSS custom properties for just about every aspect of your form, with live preview of the form elements, and optional predesigned themes.

CSS Blurry Shimmer Effect — Yair shares a step-by-step explanation of how this curious blurry shadow effect comes together, using a combo of masks, gradients, and the backdrop-filter property. CodePen demo.

The Complex and Awesome border-image Property — If you’ve never reached for the powerful border-image property, Temani demonstrates some different approaches for using it to create clever decorative accents and shapes.