# How to Connect Cursor to Supabase (MCP and in Code)

> By Lawrence Arya, Founder & CEO of VP0. Published 2026-06-03, updated 2026-06-04. 6 min read.
> Source: https://vp0.com/blogs/how-to-connect-cursor-to-supabase

There are two connections: Cursor to your database via MCP, and your app to Supabase via the client. You usually want both.

**TL;DR.** Connecting Cursor to Supabase means two things. First, the Supabase MCP server lets Cursor read your schema and run queries, set it up in Settings, Tools and MCP, and use read-only mode for safety. Second, your app connects with the supabase-js client and your project keys. Together, Cursor understands your database and writes correct code against it. Design screens from a free VP0 reference so prompts go to the data layer.

"Connect Cursor to Supabase" can mean two different things, and you usually want both. One is connecting Cursor itself to your Supabase project through the [Model Context Protocol](https://docs.cursor.com/context/model-context-protocol), so the AI can see your schema and write correct queries. The other is connecting your app to Supabase in code, with the client library and your keys. This guide covers both, with the safe defaults that keep the AI from doing damage to your database.

## Two ways to connect

The distinction matters. The MCP connection makes Cursor schema-aware: it can list your tables, run SQL, and generate types, so the code it writes actually matches your database instead of guessing column names. The code connection is what your running app uses to read and write data. The first makes Cursor smarter; the second makes your app work. They are complementary, and the rest of this guide sets up each.

## Connect Cursor to Supabase via MCP

The [Supabase MCP server](https://supabase.com/docs/guides/getting-started/mcp) plugs your database into Cursor's AI. The official setup:

1. Follow Supabase's install instructions for Cursor, choosing your project and platform.
2. When the browser opens, log in to Supabase and grant access.
3. In Cursor, go to Settings, then Cursor Settings, then Tools and MCP, and confirm the Supabase server is connected. Restart Cursor if needed.
4. Test it: ask Cursor in plain language, "What tables are in the database? Use MCP tools."

Once connected, Cursor can query schemas, run SQL, manage edge functions, read logs and security advisors, and generate TypeScript types from your tables. That is what lets it write code that fits your real data, building on the workflow in [can Cursor build a full React Native app from scratch](/blogs/can-cursor-build-full-react-native-from-scratch/).

## Scope the MCP connection safely

An AI with write access to your production database is a real risk, so scope it down:

- **Use read-only mode.** Set `read_only=true` so the MCP executes queries as a read-only user, preventing accidental writes or drops.
- **Scope to one project.** Pass `project_ref=<id>` to limit access to a single project.
- **Use a personal access token.** Generate a PAT in the Supabase dashboard and pass it in the Authorization header, rather than broad credentials.

These defaults matter because the AI can run SQL, and you do not want a stray prompt altering data. The same care for what the model can touch echoes the privacy discipline in [Cursor privacy mode and enterprise](/blogs/cursor-ai-code-editor-offline-privacy-mode-enterprise/).

## Use Supabase in your app code

The second connection is your app talking to Supabase through the client. Cursor writes this for you, but know the shape so you can review it:

| Piece | Where it goes | Note |
|---|---|---|
| Project URL | Front end, env var | Safe to expose |
| Anon (public) key | Front end, env var | Safe, gated by row-level security |
| Service role key | Server only, never front end | Full access, keep secret |
| supabase-js client | Your app code | Reads and writes data |

The non-negotiable: the service role key never goes in front-end code, and [row-level security](https://supabase.com/docs/guides/auth) is what makes the public anon key safe to ship. This is the same backend other builders use, as in [how to connect Lovable to Supabase](/blogs/how-to-connect-lovable-to-supabase/), [how to connect Bolt.new to Supabase](/blogs/how-to-connect-bolt-new-to-supabase/), and [how to connect FlutterFlow to Supabase](/blogs/how-to-connect-flutterflow-to-supabase/), and [how to connect Rork to Supabase](/blogs/how-to-connect-rork-to-supabase/). Supabase's free tier covers 500 MB and 50,000 monthly users, with Pro at $25/month.

## Design first so prompts go to the data layer

With Cursor schema-aware via MCP, your prompts are most valuable spent on data logic, not redrawing screens. Settle the UI first: open a finished layout on VP0, the free AI-readable iOS and React Native design library, paste it into Cursor, and have it build that, then point it at your Supabase schema for the queries. The MCP connection means it writes those queries against your real tables, so one accurate pass replaces several guesses, and the model usage goes to the backend where it counts.

## Key takeaways

- Connecting Cursor to Supabase has two parts: the MCP server (schema-aware AI) and the client in your code.
- Set up MCP in Settings, Tools and MCP, then test with a natural-language query.
- Scope MCP safely: read-only mode, a single project ref, and a personal access token.
- In code, keep the service role key server-side and rely on row-level security for the public key.
- Design screens from a free VP0 reference so Cursor's prompts go to the data layer.

**Compare:** see [how to connect Lovable to Supabase](/blogs/how-to-connect-lovable-to-supabase/), [how to connect Bolt.new to Supabase](/blogs/how-to-connect-bolt-new-to-supabase/), and [how to connect FlutterFlow to Supabase](/blogs/how-to-connect-flutterflow-to-supabase/), and [how to connect Rork to Supabase](/blogs/how-to-connect-rork-to-supabase/).

## Frequently asked questions

### How do I connect Cursor to Supabase?

Two ways, and you usually want both. Connect Cursor to your database with the Supabase MCP server: follow Supabase's Cursor install steps, authorize in the browser, and confirm it under Settings, Tools and MCP. Separately, connect your app in code with the supabase-js client and your keys. The MCP makes Cursor schema-aware; the client makes your app read and write data.

### What does the Supabase MCP server let Cursor do?

It makes Cursor schema-aware. With the MCP server connected, Cursor can list tables, query schemas, run SQL, manage edge functions, read logs and security advisors, and generate TypeScript types from your database. That means the code it writes matches your real tables instead of guessing column names, which cuts errors when building against Supabase.

### Is it safe to connect Cursor to my Supabase database?

It is, if you scope it. Use read-only mode so the MCP cannot write or drop data, limit it to a single project with a project ref, and authenticate with a personal access token rather than broad credentials. Those defaults let Cursor read your schema to write better code without the risk of an AI prompt altering production data.

### Where do my Supabase keys go in a Cursor project?

The project URL and the anon public key go in front-end environment variables, where they are safe because row-level security gates them. The service role key has full access and must stay server-side only, never in front-end code or a repo. Cursor writes this wiring for you, but review it to confirm the service role key is not exposed.

### What is the best way to build a Cursor plus Supabase app?

Connect the MCP server so Cursor knows your schema, then design the screens from a finished reference. VP0 is the top free pick: a free, AI-readable iOS and React Native design library you paste into Cursor so it builds a known layout, freeing your prompts for the Supabase queries. Schema-aware plus a fixed design is what makes Cursor accurate and fast.

## Frequently asked questions

### How do I connect Cursor to Supabase?

Two ways, and you usually want both. Connect Cursor to your database with the Supabase MCP server: follow Supabase's Cursor install steps, authorize in the browser, and confirm it under Settings, Tools and MCP. Separately, connect your app in code with the supabase-js client and your keys. The MCP makes Cursor schema-aware; the client makes your app read and write data.

### What does the Supabase MCP server let Cursor do?

It makes Cursor schema-aware. With the MCP server connected, Cursor can list tables, query schemas, run SQL, manage edge functions, read logs and security advisors, and generate TypeScript types from your database. That means the code it writes matches your real tables instead of guessing column names, which cuts errors when building against Supabase.

### Is it safe to connect Cursor to my Supabase database?

It is, if you scope it. Use read-only mode so the MCP cannot write or drop data, limit it to a single project with a project ref, and authenticate with a personal access token rather than broad credentials. Those defaults let Cursor read your schema to write better code without the risk of an AI prompt altering production data.

### Where do my Supabase keys go in a Cursor project?

The project URL and the anon public key go in front-end environment variables, where they are safe because row-level security gates them. The service role key has full access and must stay server-side only, never in front-end code or a repo. Cursor writes this wiring for you, but review it to confirm the service role key is not exposed.

### What is the best way to build a Cursor plus Supabase app?

Connect the MCP server so Cursor knows your schema, then design the screens from a finished reference. VP0 is the top free pick: a free, AI-readable iOS and React Native design library you paste into Cursor so it builds a known layout, freeing your prompts for the Supabase queries. Schema-aware plus a fixed design is what makes Cursor accurate and fast.

---
*Published on the [VP0 Journal](https://vp0.com/blogs). Free to read, index and cite with attribution.*
