# How do I connect an API, Airtable or Supabase?

> All three use the same flow: press Connect Source, pick the type, hand over a key, then point the wizard at the rows you want.

## Before you start

- A key or token for the service you are connecting.
- A paid plan — connected data sources are a PRO feature.

> **Careful:** The key you enter is saved with the data source inside the Figma file, so that anyone opening the file can refresh the chart. Treat it the way you would treat anything else pasted into a shared file, and prefer a read-only or scoped key.

> **Tip:** Check the connection before you move on. Airtable and Supabase both offer Test Connection on their table step, and the API wizard has Test & Preview, which shows the raw response so you can confirm the data path.

> **Note:** When you are adding data to a chart you already have open, the wizard skips its chart-type suggestion step and applies the data to the current chart instead.

## Steps

1. Open the chart's Data tab, press Connect Source, then Create New, and pick REST API, Airtable or Supabase from the grid.
2. For a REST API, enter the endpoint URL and choose GET or POST. A POST request gets a body field for the request payload.
3. On the API wizard's Authentication step pick None, API Key — where you also name the header, such as X-API-Key — or Bearer Token.
4. Then set the Data Path: the route to the array inside the response, written like data.results. The wizard lists the arrays it found and previews the response, so you can usually just click one.
5. For Airtable, paste a Personal Access Token from your Airtable account settings, then give the Base ID and the table's ID or name. A View ID is optional and narrows the rows to that view.
6. For Supabase, give the Project URL and an API Key — the anon key for public tables, the service_role key for private ones — then the Table Name. Limit and Order By are optional.
7. Every wizard finishes the same way: a Columns step where you say which column holds the labels and which hold the numbers, then the data lands in your chart.

_Topics: api, airtable, supabase_

---

Install Figma Charts: https://www.figma.com/community/plugin/1345221583582136577/figma-charts

More Figma Charts help: https://systergon.com/figma-charts/help