Three tools landed this week worth a look. Ranked by how much we’d actually use them.
1. TypePair (typepair.app): typography pairing with an opinion
Most font-pairing sites are a wall of “here are 200 combinations, pick one.” TypePair is the opposite: you tell it what you’re designing (editorial, SaaS, brand identity, e-commerce), what mood you want (serious, playful, technical, warm), and it returns one pairing with reasoning. You can ask it for a second option, but the default behavior is “here is the answer, here is why.”
The reasoning section is the differentiator. It explains why the serif works against the sans, what historical period each face is from, what the contrast in stroke widths is doing for hierarchy. It’s the kind of thing a senior type designer would tell you, and it’s the first design tool I’ve seen that’s making typography genuinely teachable.
Free for the first 10 pairings, $9/mo for unlimited. Worth it if you do brand work.
2. Atom (figma.com/community/plugin/atom): Figma plugin for brand systems
Atom is a Figma plugin that takes your design tokens (colors, type scales, spacing, radii) and treats them as a single source of truth that propagates through every component. Change --space-4 from 16px to 18px and every component using it updates.
This sounds like Variables (which Figma has had for years), and it is, but Atom layers a real dependency graph on top. You can see which components depend on which tokens, what would break if you changed something, and what design tokens are unused. For brand systems with 100+ components, this is the difference between “we have a design system” and “we have a design system we can actually maintain.”
Free up to 50 tokens, $12/mo for unlimited. Strongly recommended for anyone running a design system.
3. Motion One v3 (motion.dev): the Framer Motion alternative is finally serious
Motion One has been around for a while as a “lightweight Framer Motion alternative” but v3 (shipped this week) is the version where it stops being an alternative and starts being a default. Three reasons:
- The bundle is 6kb gzipped. Framer Motion is 50kb+. For sites that aren’t doing heavy animation, this is a huge win.
- The API is closer to the Web Animations API native primitives, so what you learn here transfers to vanilla JS.
- It now supports layout animations (the killer Framer Motion feature) without the bundle penalty. This was the missing piece for serious adoption.
If you’re starting a new project, default to Motion One. If you’re on Framer Motion and not using its more exotic features, the migration is mostly a find-and-replace.
Open source, MIT. Bookmark the docs.