thoughtbot Design Link Pack: January 2022

Alex Chen

thoughtbot January 2022 design links cover image

Ever wonder what the thoughtbot designers share on Slack? Enter the Monthly Design Link Pack Newsletter™. Enclosed, you’ll find our monthly roundup of what we’ve been reading, seeing, playing with, and ooh-ahh-ing

Just Figma Things :sparkles:

Automator for Figma: A paid Figma plugin to automate actions

Figma Updates: Figma’s 32 little big updates

Figsite: Turn Figma into a no-code website editor

Figma Store: Figma’s storefront! I’ll take one of each, please

Spacer Components in Figma: Using spacer components to drive consistency in Figma

Figma Academy: Learn advanced design tactics with hands-on lessons delivered directly inside of Figma

CSS Goodies

Codepen: Cool hover effect

Getting Started With CSS Cascade Layers: Be more intentional about ordering the “layers” of CSS rules as a new method of cascade management.

CSS Cascade Layers: Una Kravetz gives an overview of the new @layer and layer() CSS primitives

Parcel CSS: A New CSS parser, transformer, and minifier

Non-boring Gradients: Gradient generator for more awesomeness

Tailwind x Prettier: Prettier plugin for automatically sorting Tailwind classes

Design Systems

Backlight: A collaborative platform empowering front-end teams to build and ship great Design Systems

Design Systems with Backlight: Build, Ship, & Maintain Design Systems with Backlight

Hey Design Systems: A design systems resource with resources

Atomic Design and Storybook: Storybook and atomic design podcast w/ Brad Frost


Gooper: A goopy, swashy, fat faced typeface

Utopia: Elegantly scale type and space without breakpoints

Strikethrough: Typography messages of protest for civil rights

font-variant-numeric: CSS tip: align numbers neatly in a tables, progress counters, etc.

Eye Candy :candy:

Mushroom Color Atlas: Explore the chromatic universe of fungi

British & Exotic Mineralogy: Explore all 2,242 illustrations from James Sowerby’s compendium of knowledge about mineralogy

Music For Programming: MFP (music for programming) got a makeover!

Emoji to Scale: Your favorite emojis. To scale (more or less)

Good Reads :book:

“Agile” is eating design’s young: A critique and exploration of embedded designers

Metaphors We Web By: A history of our metaphorical understanding of the web

Resources for the designer toolkit

Descript: Automatic and human-powered transcription

Laws of UX: A collection of best practices that designers can consider when building user interfaces

This month’s newsletter is brought to you by…