← Articles

Mar 2026

Design Faster & Smarter with Reference Overlay Figma Plugin

Upload, compare, and take notes without leaving your Figma canvas.

Design Faster & Smarter with Reference Overlay Figma Plugin

We all live in references as designers. Screenshots, moodboards, inspiration shots, PRDs, random notes scribbled in a hurry. We are constantly flipping between “that thing over there” and the canvas we are actually working on.

And honestly? That flipping sucks. You zoom out, scroll over to your reference tab/window/layer, squint, zoom back in… repeat 50 times a day. Or you end up dragging screenshots straight onto your artboard until it looks like a digital hoarder’s desk. Product designers get it even worse, we are usually trying to build flows while eyeballing a spec in another browser tab, then alt-tabbing like it’s 2005.

Reference Overlay is the little Figma plugin I built to fix exactly that pain.

It just floats your references right over your workspace, images, PDFs, docs, Notes, whatever, so you never have to leave the canvas or bury your artboard in random pics.

Reference Overlay plugin on the Figma canvas

How it actually works

Upload images: You can upload one or more images in PNG, JPEG or SVG format. You can also pick colors from these images, convert them to greyscale or compare two images at the same time.

Upload Documents: Upload any document in PDF, DOCX, HTML, Markdown, or plain text format. The plugin maintains the original format and structure of the content as much as possible.

Write & SaveNotes: Write and save multiple notes with a subject that allows better organization. The notes are auto saved and you can delete it when you are done with it.

Reference Overlay notes and document tabs

These features show up in a clean floating panel that stays put no matter how much you zoom or pan the canvas.

You can zoom/pan the references themselves independently.

Switch between an Images tab, a Docs tab and Notes Tab so everything lives in one tidy spot instead of 17 browser tabs.

Result? A way cleaner, more focused canvas.

A cleaner Figma canvas with Reference Overlay

No more scattered screenshots everywhere. No more awkward side-by-side split views that cramp your layout. Your references are always right there when you need them, but they don’t fight with your actual design.

If you’ve ever muttered “why is this so annoying” while tab-switching for the hundredth time… give it a try. It’s small, but it removes so much stupid friction.

Early Feedbacks

I work with stakeholders who often follow me around on Figma, with a plugin like this I will regain some level of my privacy and process and also keep my thoughts organized. This is awesome. — Samuel, Lead UX Designer
Felt like this is really created for me because it came in at the right time. This is a great one. Thank you, Quadmor. — Quadri B. Lead UX Designer
This has been so useful. Focus enhanced👍 Well done Quadmor. — Peter UX Designer

Start Using it Today

Reference overlay Plugin: https://www.figma.com/community/plugin/1608990953292975108/reference-overlay

First published on Medium.

Download CVBehanceLinkedinGithub