Supabase
Link your project to a Supabase project to use its Postgres database, authentication and storage. Frontend writes the keys your app needs and gives the agents tools for the linked project.
Connect
Section titled “Connect”- Open Integrations in the project’s sidebar and choose Supabase.
- If your team hasn’t connected Supabase yet, click Connect Supabase and authorize your Supabase organization. Organizations belong to the team, so every project can use them. Add more with Add organization.
- Pick a project from the list and click Add, or create one in Supabase first.
What it sets up
Section titled “What it sets up”Environment variables, with your framework’s public prefix where the browser needs them:
| Variable | Value |
|---|---|
<prefix>SUPABASE_URL | The project’s API URL |
<prefix>SUPABASE_PUBLISHABLE_KEY | The publishable (anon) key, safe for the browser |
SUPABASE_SECRET_KEY | The secret (service role) key, for server code only |
For example, NEXT_PUBLIC_SUPABASE_URL in Next.js or VITE_SUPABASE_URL in Vite apps. See Frameworks.
Supabase tools on the Frontend MCP server, scoped to the linked project, so Claude Code, Codex, OpenCode and Frontend AI can read the schema, run SQL and migrations, deploy and delete edge functions, and edit the auth email templates. They use your team’s Supabase connection and refresh its token as needed. See MCP.
Manage the project
Section titled “Manage the project”Click Open Supabase on the integration’s page to manage the linked project from Frontend, or switch it to another project.
Disconnect
Section titled “Disconnect”Click Disconnect on the integration’s page to unlink the Supabase project. The project and its data stay in Supabase.
Supabase isn’t required for a database: Frontend Cloud gives every project its own SQL database too.