HubSpot Pipeline Synced to FigJam

Sales pipeline reviews live in two places: the CRM and the design canvas. This plugin eliminates the gap. Built as a FigJam plugin, it connects directly to HubSpot via a lightweight Netlify serverless proxy — pulling live deal data and rendering it as a fully formatted, color-coded table right inside your board. Hit sync, and within seconds your pipeline is updated, newest to oldest, shaded across four tiers of blue to communicate deal stage at a glance.

How it works

The plugin UI lets you configure date ranges per table — Pipeline and Win/Loss are both supported. Leave the defaults and it syncs fast; customize the range and it filters accordingly. Under the hood, the plugin posts to a Netlify proxy function that handles the HubSpot API auth and CORS constraints that would otherwise block a browser-based plugin. The proxy is stateless, the token is never stored, and the whole thing deploys in about five minutes.

The FigJam tables themselves use conditional color fills mapped to deal stage and outcome — green for wins, pink for losses, blue gradients for pipeline health. The visual grammar is immediate: you don’t need to read the data to understand the shape of the quarter.

The thinking behind it

This started as a practical problem for a Brand Studio team doing quarterly reviews. They were manually exporting HubSpot data, formatting it in spreadsheets, and pasting screenshots into decks. That’s a three-step process that goes stale the moment it’s done. The plugin collapses all of that into a single button inside the tool the team already works in.

The UI was also deliberately kept minimal — a small set of date inputs and a sync button. The goal wasn’t to replicate HubSpot inside Figma; it was to get just enough data into the canvas to make the conversation meaningful.

What this unlocks

The proxy pattern here is worth highlighting on its own. Any Figma or FigJam plugin that needs to talk to an authenticated third-party API can use this exact architecture — a lightweight Netlify function standing between the plugin and the service. It’s reusable for Notion, Airtable, Salesforce, or any API with CORS restrictions. The plugin becomes a thin client; the real work happens server-side where auth is clean and fast.