WDW #414

🗞 Highlights

icons

Google’s Newest Icons
Google’s new library of modern icons. Every icon can be configured with a color/background fill, different weights, different grades, and any pixel size.
Google (Icons)

7 Web Design Trends for 2022
Some of the trends in web design that could make an impact in the upcoming year, according to Media Temple. Includes color, music, gallery walls and more…
Alex Alabbas (Design)

Web Color is Still Broken
Colors may not be displayed correctly in web browsers. Why not? 
Web color is still broken (Coloring)

tree

Occlusion Grotesque
Occlusion Grotesque is an experimental typeface that is carved into the bark of a tree. As the tree grows, it deforms the letters and outputs new design variations, that are captured annually.
Bjoern Karmann (Typography)

🛠 Tools / Resources

Hover

Cool Hover Effects That Use Background Properties
In this post, Temani Afif will re-work the hover effect, but also expand it into other types of hover effects that only use CSS background properties.

Fluid Type Scale Calculator
Generate font size variables for a fluid type scale with CSS clamp. Grab the output CSS and drop it into any design system.

Under-Engineered Multi-Selects
A different way to let users select multiple choices from a set.

slide

What If Our Sliders Actually Slid?
Jhey Tompkins explores one of GreenSocks’ newest plugins alongside React to create an impractical whimsical spin on a well-known native element: <input type=”range”/>.

Over 1950 pixel-perfect icons for web design
Free and open source icons.

⚡ Snippets

  • Reducing spam from mailto links
  • Rust from 0 to 80% for JavaScript developers
  • Emoji are a font. It’s time they started behaving more like one.
  • Apple unveils the best photos from the Shot on iPhone Macro Challenge.
  • Google gives Europe a ‘reject all’ button for tracking cookies after fines from watchdogs