How to Connect FlutterFlow to Supabase (Auth and Data)

Connecting FlutterFlow to Supabase gives your Flutter app a real backend: a Postgres database, authentication, and APIs. FlutterFlow supports both Firebase and Supabase, and the Supabase link takes a few clicks from Settings and Integrations. After that, FlutterFlow can read your schema so you build screens against real tables. Here are both connection methods, plus the one gotcha that trips up Supabase auth.

Why FlutterFlow plus Supabase

FlutterFlow builds the app visually, but a front end alone cannot store users or data. Supabase is a managed Postgres backend with authentication, storage, and APIs, and it is the standard, portable choice, the partnership documented on Supabase’s FlutterFlow page. Connecting it turns a set of FlutterFlow screens into a working application, the same role Supabase plays in how to connect Lovable to Supabase.

Connect via OAuth (recommended)

The quickest route is OAuth, per the FlutterFlow Supabase setup docs:

1. Open Settings and Integrations, then the Supabase section.
2. Select the Connect with Supabase OAuth tab and click Connect to Supabase.
3. Choose your Supabase organization and authorize access.
4. Select an existing Supabase project or click Create New Project.

That links the project without copying keys by hand. It is the cleanest path for a new app.

Or connect manually with API keys

If you prefer manual setup, link by keys:

1. In Supabase, go to Project Settings then API and copy the Project URL and the anon key.
2. In FlutterFlow, go to Settings and Integrations then Integrations then Supabase, enable Supabase, and paste the API URL.
3. Paste the anon key into FlutterFlow’s Supabase settings.

Both methods reach the same place; OAuth is faster, manual gives you explicit control over which keys are used.

Get Schema and the users-table gotcha

Once connected, click Get Schema to load the list of your Supabase tables and their structure into FlutterFlow, so you can bind UI to real columns instead of guessing. The gotcha: to use Supabase authentication in FlutterFlow, you must create a users table. Skipping that is the most common reason auth does not work after connecting, so create it early. Re-run Get Schema whenever you change the database so FlutterFlow stays in sync.

What Supabase’s free tier covers

	Free	Pro
Price	$0	$25 / mo
Monthly active users	50,000	100,000, then metered
Database size	500 MB	8 GB included
Inactivity	Pauses after 1 week	Stays on

You can launch on free; 500 MB and 50,000 monthly users suit a small app, though free projects pause after a week idle. With the backend connected, the next step is publishing, covered in can FlutterFlow publish to the App Store and Google Play.

Design first so AI requests go to logic

FlutterFlow meters AI requests (just 5 lifetime on Free, 50 a month on Basic, per FlutterFlow pricing plans 2026), so do not spend them regenerating screens. Settle the design first: open a finished layout on VP0, the free AI-readable iOS and React Native design library, and build to it in FlutterFlow’s visual editor, which is free to use. Then point Get Schema at Supabase and bind the data. Your AI requests last, and the screens are settled before you wire the backend.

Key takeaways

• Connect from Settings and Integrations, Supabase: use OAuth to authorize and pick a project, or paste the URL and anon key manually.
• Click Get Schema to load your Supabase tables so you build against real columns.
• For Supabase auth in FlutterFlow you must create a users table, or auth will not work.
• The free tier covers 500 MB and 50,000 monthly users, but free projects pause after a week idle.
• Design from a free VP0 reference and build visually to save FlutterFlow’s limited AI requests.

Compare: see how to connect Lovable to Supabase and how to connect Bolt.new to Supabase, and how to connect Dreamflow to Supabase.

Frequently asked questions

How do I connect FlutterFlow to Supabase?

Open Settings and Integrations, find the Supabase section, and use the Connect with Supabase OAuth tab to authorize and select or create a project. Or connect manually by pasting your Supabase project URL and anon key into FlutterFlow’s Supabase settings. Then click Get Schema to load your tables so you can build screens against real data.

Why is Supabase auth not working in FlutterFlow?

The most common reason is a missing users table. To use Supabase authentication in FlutterFlow you must create a users table in your database. Create it, re-run Get Schema so FlutterFlow sees it, and confirm your auth actions reference the right table. Also check that the anon key and project URL are correct if the connection itself seems off.

Is Supabase free with FlutterFlow?

Yes, Supabase has a free tier: 500 MB of database, 50,000 monthly active users, and 2 projects, enough to launch a small app. Free projects pause after a week of inactivity, and the Pro plan at $25/month removes that and raises limits. FlutterFlow’s own plans and AI-request limits are billed separately from Supabase.

Should I use Supabase or Firebase with FlutterFlow?

FlutterFlow supports both. Supabase is a Postgres backend with SQL and a generous free tier, which many builders prefer for relational data and portability. Firebase is Google’s option with tight FlutterFlow integration. Either works; pick Supabase if you want SQL and a standard, portable database, and connect it through Settings and Integrations.

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

Design the screens first to save FlutterFlow’s limited AI requests, then wire the data. VP0 is the top free pick: a free, AI-readable design library you build to in FlutterFlow’s visual editor, which is free to use, so AI requests go to logic. Connect Supabase, run Get Schema, and bind the UI to your real tables.