PlotSet LogoPlotSet

Charts for Figma

The PlotSet chart plugin for Figma: build a real chart or map from real data without leaving the file, then drop it onto the canvas as editable vectors. Free, and the same chart publishes as a live embed for FigJam and the web.

Un gráfico creado con datos de Figma

No es una captura — es un gráfico interactivo real, insertado igual que lo estaría el tuyo.

Ejemplo: Desktop browser market share

El código para insertar

Una línea de HTML. Es el código real del gráfico de arriba — pégalo en cualquier página que acepte HTML.

<iframe width="100%" height="100%" src="https://plotset.com/api/embed/a9e16fe6-01fd-4a3d-b2d9-396b657b665b" />

El tamaño es cosa tuya: define el ancho y el alto en el iframe, o envuélvelo en un contenedor con la proporción que prefieras.

PlotSet y Figma, sin adornos

Most charts in Figma files are drawn by hand — a rectangle per bar, a pen-tool line, numbers typed in from a screenshot. They look right until the data changes, or until someone asks what the axis is. PlotSet's Figma plugin replaces that with a real charting tool running inside the file: you pick a template from the same catalogue the web app uses, bring in your rows, style it to match the design, and the finished chart comes back onto the canvas. It arrives as SVG, so it lands as vector shapes and text layers you can select, recolour and mask like anything else you drew — not a flattened PNG. What the plugin deliberately does not do is publish: sharing, live embeds and video export stay in the web app, because a Figma canvas is not where an embed URL is useful.

Cómo hacer un gráfico con datos de Figma

De la hoja de cálculo al gráfico publicado, paso a paso.

01

Install the plugin

Search the Figma Community for "PlotSet Charts and Maps", or open it directly from figma.com/community/plugin/1421122515439713398. It runs in design files and needs no account to try.

02

Run it and pick a template

Right-click → Plugins → PlotSet Charts and Maps. The panel opens on the template browser: bar, line, pie, sankey, treemap, population pyramid, choropleth and symbol maps for 119 geographies, and the rest of the catalogue.

03

Bring your data in

Paste rows straight from a spreadsheet, drop in a CSV or Excel file, or connect a Google Sheet. Column types are detected as you paste, so dates stay dates and numbers stay numbers.

04

Style it to match the design

Set the palette to your product colours, the typeface to the one the file already uses, and the number formatting to whatever the rest of the screen does. Doing it here saves undoing Figma defaults later.

05

Export to Figma

The Export button becomes "Export to Figma". Set the size you want the chart to occupy, export, and the chart is placed on the canvas as a vector group, ready to position in the frame.

06

Restyle or re-export as the design moves

Small tweaks — a colour, a label — are faster in Figma once the vectors are there. Anything that changes the data is faster back in the plugin: change the rows, export again, replace the group.

Lo que ganas frente a los gráficos de Figma

  • Real numbers in the mockup

    A dashboard designed against invented data hides the problems that matter: the label that wraps, the long tail that flattens the bars, the category nobody budgeted space for. Real rows surface them at design time.

  • Chart types nobody wants to draw by hand

    Sankey diagrams, treemaps, choropleth and symbol maps, population pyramids, bump charts, marimekko. Around 300 templates, all of which would be a bad afternoon with the pen tool.

  • It comes across as vectors, not a screenshot

    The export is SVG, so the chart lands as editable shapes and text. Recolour a series, mask a region, restyle a label — without going back to the source or losing crispness at any zoom.

  • The same chart can go live later

    A chart built in the plugin is a normal PlotSet project. When the design ships, open it in the web app and publish it as an interactive embed for the site, the docs or a FigJam board — one source, two destinations.

Lo que esto no hace

  • A Figma design file cannot render a live chart

    Design files place images and vectors, not iframes. What lands on the canvas is a snapshot of the chart as it looked when you exported it — interactive tooltips exist in the published embed, not in the file.

  • Publishing and sharing are not in the plugin

    Share, gallery publishing and video export are hidden inside Figma on purpose. Open the project in the PlotSet web app when you need an embed URL or an MP4.

  • The exported vectors do not update themselves

    Once the chart is on the canvas it is Figma geometry with no link back. When the data changes, re-export and swap the group — the same discipline as any other imported asset.

  • Fonts have to exist on both sides

    The chart carries the typeface you chose in the plugin. If the file expects a font that is not installed for whoever opens it, Figma will substitute — pick a font the team actually has, or convert the labels to outlines.

Preguntas sobre los gráficos de Figma

Yes — "PlotSet Charts and Maps" on the Figma Community. It runs the PlotSet editor inside a Figma design file and places the finished chart on your canvas.

Publica tus datos de Figma como un gráfico interactivo

Trae tus filas y consigue un gráfico interactivo insertable en un par de minutos — gratis y sin tarjeta.