Is Refine tied to a specific UI library?

No, it's headless and includes built-in support for Ant Design, Material UI, Mantine, and Chakra UI, or custom designs with Tailwind CSS.

What backends can Refine connect to?

15+ data providers including REST, GraphQL, Supabase, Hasura, Appwrite, Firebase, Strapi, and Airtable.

Does Refine support server-side rendering?

Yes, it works with Next.js and Remix, and can power customer-facing apps like storefronts.

How does Refine manage state?

Through React Query, giving CRUD screens caching and mutation handling out of the box.

Can Refine scaffold CRUD screens automatically?

Yes, it auto-generates CRUD UI based on the structure of your API data.

How do I start a new Refine project?

Run `npm create refine-app@latest my-refine-app` or try it in the browser playground.

Refine: Open source Retool alternative

Refine (Refine CORE) is a headless, open-source React meta-framework for building CRUD-heavy applications such as admin panels, dashboards, and internal tools. It ships hooks and components for authentication, access control, routing, networking, state management, and i18n, while leaving UI and routing choices to the developer. It integrates with data providers for 15+ backends and works with UI kits like Ant Design, Material UI, Mantine, and Chakra UI, or with plain Tailwind CSS.

Key features

Headless core: business logic is decoupled from UI and routing, so any design system or router can be plugged in.
15+ data provider connectors: REST, GraphQL, Airtable, Strapi, Supabase, Hasura, Appwrite, Firebase, Sanity, Directus, and more.
Auto-generated CRUD UI: scaffolds list, create, edit, and show views from your API's data structure.
React Query-based state management: data fetching, caching, and mutations run through React Query under the hood.
SSR support: works with Next.js and Remix for server-rendered admin panels and customer-facing storefronts.
Built-in auth and access control providers: plug in authentication and permission logic without hand-rolling it.
Refine Devtools: inspect data flow and app state during development.

Ideal use cases

Refine CORE targets data-intensive B2B applications: internal tools, admin panels, and dashboards where most screens are lists, forms, and detail views wired to an API. Because it's headless, teams that already have a design system or a specific UI kit requirement, such as Ant Design, Material UI, Mantine, Chakra UI, or a custom Tailwind design, can adopt Refine without rebuilding their component library. The built-in data provider interface means teams aren't locked into a single backend: a project prototyped against a REST API can later move to GraphQL, Supabase, or Hasura by swapping the data provider rather than rewriting page logic. SSR support through Next.js or Remix extends Refine beyond purely internal tools into customer-facing use cases like storefronts, where the same CRUD patterns apply but pages need to be indexable and fast on first load. Built-in audit logging and document versioning support use cases like compliance-heavy internal tools where every change to a record needs a traceable history, and the multitenancy example demonstrates the pattern for products serving several distinct customer organizations from one shared codebase.

Getting started

A new Refine project scaffolds in seconds with npm create refine-app@latest my-refine-app, or can be tried directly in the browser without a local setup. A minimal app wires a Refine component with a dataProvider pointing at an API and a routerProvider, then defines resources like products that map to list, create, and edit routes. From there, hooks like useDataGrid and useMany handle fetching, pagination, and relational lookups so the generated screens stay in sync with the underlying API.