Published

Link your Figma designs in Screenshotbot

Arnold Noronha
Arnold Noronha
Founder, Screenshotbot

Screenshotbot now lets you attach Figma designs directly to your screenshots! No more alt-tabbing between tools to figure out if your button is supposed to be 12px or 16px from the edge.

The Problem (You Know This One)

You’ve been there. Designer hands off a beautiful Figma mockup, you implement it, and during code review someone asks “wait, is this spacing right?” Cue the frantic Figma tab hunt.

The usual questions:

  • Does this match what the designer actually wanted?
  • Are we even looking at the right version of the design?
  • Why did they choose this particular shade of blue?

But here’s the kicker: six months later, a new developer comes in and modifies a shared button component. But they have zero context about the original design decisions around the screens that use this button. Should the button be 44px tall or 48px? Who knows! The Figma link is buried in some Slack thread from last quarter.

We got tired of playing this game, so we fixed it.

How It Works

Now you can link Figma designs right to your screenshot tests. It’s pretty straightforward:

  1. Open any Screenshotbot report or run
  2. Click the “Figma” dropdown and select “Link to Figma”
  3. In Figma, select the component, and copy paste the URL into Screenshotbot
  4. We automatically grab an image of the component and save the direct link (we’ll authenticate seamlessly with OAuth)

Your screenshot test now has the design right there next to it. Any time somebody modifies the screenshot they’ll see exactly what the designers intended.

Why This Actually Matters

No More Context Switching: Everything lives in one place. Your test, the actual screenshot, and the design it’s supposed to match.

Future You Will Thank You: When someone (probably you) needs to modify this component months later, the design context is right there.

Code Reviews Get Faster: “Does this match the design?” becomes a 2-second visual check instead of a 5-minute Figma expedition.

Designers Stay in the Loop: They can see exactly how their designs turned out without having to ask developers for screenshots.

Try It Out

This is live for everyone right now. Next time you’re setting up a screenshot test, try linking the Figma design. It takes about 30 seconds and makes future you much happier.

We’re already working on some other cool stuff around this – maybe some automated comparison scoring, support for other design tools. But for now, go attach some designs to your tests and see how it feels.

Jump into your Screenshotbot dashboard and give it a shot.

Got ideas for what we should build next? Hit us up – we love hearing from people who actually use this stuff.

Did you enjoy this post? Share the knowledge!