Journal

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

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

How to Connect Cursor to Supabase (MCP and in Code): the App Store logo on a glass tile over a blue gradient with bubbles

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, 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 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.

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.

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:

PieceWhere it goesNote
Project URLFront end, env varSafe to expose
Anon (public) keyFront end, env varSafe, gated by row-level security
Service role keyServer only, never front endFull access, keep secret
supabase-js clientYour app codeReads and writes data

The non-negotiable: the service role key never goes in front-end code, and row-level security 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, how to connect Bolt.new to Supabase, and how to connect FlutterFlow to Supabase, and 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, how to connect Bolt.new to Supabase, and how to connect FlutterFlow to Supabase, and 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.

Questions from the community

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.

Part of the AI App Builders: Pricing, Code Ownership & Shipping hub. Browse all VP0 topics →

Keep reading

How to Connect Dreamflow to Supabase (One-Click Setup): a reflective 3D App Store icon on a blue and purple gradient
Workflows 5 min read

How to Connect Dreamflow to Supabase (One-Click Setup)

Dreamflow has one-click Supabase integration: describe the backend in your prompt and it scaffolds auth and a database. Steps and the row-level security gotcha.

Lawrence Arya · June 3, 2026
How to Connect FlutterFlow to Supabase (Auth and Data): a phone toggle icon surrounded by location, calendar, settings, wallet and chart app icons on a coral gradient
Workflows 5 min read

How to Connect FlutterFlow to Supabase (Auth and Data)

Connect FlutterFlow to Supabase with OAuth or manually with API keys to add auth and a Postgres database. Here are the steps and the users-table gotcha.

Lawrence Arya · June 3, 2026
How to Connect Replit Agent to Supabase (External DB): a phone toggle icon surrounded by location, calendar, settings, wallet and chart app icons on a coral gradient
Workflows 5 min read

How to Connect Replit Agent to Supabase (External DB)

Connect Replit Agent to Supabase as an external Postgres backend: the Agent wires the client and stores your keys in Secrets. Steps and why to choose it.

Lawrence Arya · June 3, 2026
How to Connect Rork to Supabase (Auth and Database): a glowing iPhone home-screen icon on a purple and blue gradient
Workflows 5 min read

How to Connect Rork to Supabase (Auth and Database)

Connect Rork to Supabase to add auth and a Postgres database to your React Native app, with API keys kept server-side via Rork Backend. Steps and gotchas inside.

Lawrence Arya · June 3, 2026
How to Connect Bolt.new to Supabase (Auth and Database): a glowing iPhone home-screen icon on a purple and blue gradient
Workflows 5 min read

How to Connect Bolt.new to Supabase (Auth and Database)

Connect Bolt.new to Supabase from project settings to add auth, a Postgres database, and edge functions. Here are the exact steps and the gotchas to avoid.

Lawrence Arya · June 2, 2026
How to Connect Lovable to Supabase (Auth and Database): a vivid neon 3D App Store icon on an orange, pink and blue gradient
Workflows 6 min read

How to Connect Lovable to Supabase (Auth and Database)

Connect Lovable to Supabase in a few clicks to add login, a Postgres database, storage, and edge functions. Here are the exact steps and the common gotchas.

Lawrence Arya · June 2, 2026