thoughtbot Design Link Pack: October 2021

Elaina Natario

Ever wonder what the thoughtbot designers share on Slack? Well today is your lucky day. Welcome to our Very Official Design Link Pack Newsletter™. Enclosed, you’ll find our monthly roundup of what we’ve been reading.

All things Figma!

Logo Layout: A figma plugin to optically scale and distribute logos in a grid.

Find & Replace: Figma plugin to find and replace text using regular expressions.

Mesh gradients in Figma!: Aww yisss!

Text Edit: Figma plugin to edit all of your text in one place.

Interactive components: less wiring, more inspiring: Figma introduced interactive components!

New FigJam Features: Cool new things in FigJam!

2021 Surveys

State of CSS 2021: The annual survey about the latest trends in CSS.

Jamstack Survey 2021: See how developers are using Jamstack this year.

State of Design Systems 2021 Survey: Annual Design Systems survey from Material.

The Design System Documentation Survey: Design system documentation has been maturing at a rapid pace over the last five years. How we document is an opportunity for us to stop, reflect and figure out the biggest challenges that face us in how we document and grow our design systems.


Tailwind 3.0.0 alpha: The first alpha release of Tailwind CSS v3.0 is here!

Eleventy 1.0: The very first Eleventy 1.0 Beta release is now available.

CSS and other web things

Tired emoji: Lynn Fisher does it again with the most accurate tired emoji of all time.

CSS is Going Gosh-Darned Hog Wild, I Tell Ya What: CSS: So hot right now.

Was it easier to build websites a decade ago?: Is it actually harder to make a website in 2021 than it was in 1996?

Conditional Border Radius: How to use CSS comparison functions to create a conditional border radius.

Eye Candy

Stripe Press: Books …but in 3D!

Logobook: Discover the world’s finest logos, symbols and trademarks.

Let’s Make One of Those Fancy Scrolling Animations Used on Apple Product Pages: How Apple actually makes those fancy scrolling animations.

Tools, Tutorials, and Games

Blending super smooth gradients: A thread on making a custom gradient smoothing tool.

Alpha Paintlet: Baby’s first CSS Houdini Paint Worklet.

Coding Font: A gamified web app to help you find your favorite coding font.

Hocus:Focus: A keyboard accessibility horror game.


Open Demographics documentation: A recommended set of questions that anyone can use to ask community members about their demographics.

DTCG Glossary: A glossary for design tokens.

Do you design? Stop.

Real designers only have meetings to discuss designing the designs.

Real designers design in their minds while doing other tasks, then forget when they get back to their workspace.

If you are a web designer, you need to start designing with ketchup.

thoughtbotters doing cool stuff

Monument Palettes: Elaina made a site that collects the color palettes for Monument Valley I.

Use Variants to Enforce Component Rules in Figma: Stephen shares how to enforce rules on variants and how Figma puts default rules into place.

This month’s newsletter is brought to you by…