Skip to main content
Loading...
GitHub stars so far

Open-source Retool for Enterprise

Build React-based internal tools, admin panels, dashboards & B2B apps with unmatched flexibility.

See Docs

Trusted by developers from

The sweet spot between low-code and full-code.

Drag-and-drop tools shine initially but collapse under the weight of complexity. Refine offers comparable speed at the start and infinite scaling in the long run.

Business applications not only share fundamental UI elements, but also the underlying logic.

Stop writing repetitive code for CRUD, security and state management. Let Refine automatically transform your UI elements to enterprise-grade:

UI of refineUI of refineUI of refineUI of refineUI of refineUI of refine
Code of refine
Code of refine
Code of refine
Code of refine
Code of refine
Code of refine

Start faster, maintain easier, manage complexity.

Firebase
npm i refine-firebase
Ably
npm i @refinedev/ably
Airtable
npm i @refinedev/airtable
Appwrite
npm i @refinedev/appwrite
Directus
npm i @tspvivek/refine-directus
Elide
npm i elide-simple-rest
Elide GraphQL
npm i elide-simple-graphql
Hasura
npm i @refinedev/hasura
Hook Form
npm i @refinedev/react-hook-form
Ant Design
npm i @refinedev/antd
Material UI
npm i @refinedev/mui
Mantine
npm i @refinedev/mantine
Chakra UI
npm i @refinedev/chakra-ui
shadcn/ui
npx shadcn-ui init
Tailwind CSS
npx tailwindcss init
Headless UI
npm i @headlessui/react
Firebase
npm i refine-firebase
Ably
npm i @refinedev/ably
Airtable
npm i @refinedev/airtable
Appwrite
npm i @refinedev/appwrite
Directus
npm i @tspvivek/refine-directus
Elide
npm i elide-simple-rest
Elide GraphQL
npm i elide-simple-graphql
Hasura
npm i @refinedev/hasura
Hook Form
npm i @refinedev/react-hook-form
Ant Design
npm i @refinedev/antd
Material UI
npm i @refinedev/mui
Mantine
npm i @refinedev/mantine
Chakra UI
npm i @refinedev/chakra-ui
shadcn/ui
npx shadcn-ui init
Tailwind CSS
npx tailwindcss init
Headless UI
npm i @headlessui/react
GraphQL
npm i @refinedev/graphql
Kbar
npm i @refinedev/kbar
Medusa
npm i @refinedev/medusa
NestJS CRUD
npm i @refinedev/nestjsx-crud
Nestjs-query
npm i @refinedev/nestjs-query
Next.js
npm i @refinedev/nextjs-router
Remix
npm i @refinedev/remix-router
REST
npm i @refinedev/simple-rest
Strapi
npm i @refinedev/strapi-v4
Supabase
npm i @refinedev/supabase
Hygraph
npm i @acomagu/refine-hygraph
Sanity
npm i refine-sanity
SQLite
npm i refine-sqlite
JSON:API
npm i refine-jsonapi
GraphQL
npm i @refinedev/graphql
Kbar
npm i @refinedev/kbar
Medusa
npm i @refinedev/medusa
NestJS CRUD
npm i @refinedev/nestjsx-crud
Nestjs-query
npm i @refinedev/nestjs-query
Next.js
npm i @refinedev/nextjs-router
Remix
npm i @refinedev/remix-router
REST
npm i @refinedev/simple-rest
Strapi
npm i @refinedev/strapi-v4
Supabase
npm i @refinedev/supabase
Hygraph
npm i @acomagu/refine-hygraph
Sanity
npm i refine-sanity
SQLite
npm i refine-sqlite
JSON:API
npm i refine-jsonapi
Seamless connectivity

Out-of-the box integrations for 15+ services including custom REST and GraphQL API’s.

All integrations
Wheel? Already invented.

Start with a well-structured boilerplate, built around the industry’s best practices.

Learn more
1import React from "react";
2
3import { useList } from "@refinedev/core";
4
5export const List: React.FC = () => {
6 const {
7 data: { data, total },
8 isLoading,
9 } = useList();
10
11 if (isLoading) return <div>Loading...</div>;
12
13 return (
14 <div>
15 <h1>Products</h1>
16 <h3>Showing {total} products in total.</h3>
17 <ul>
18 {data?.map((product) => (
19 <li key={product.id}>
20 <span>{product.name}</span>
21 </li>
22 ))}
23 </ul>
24 </div>
25 );
26};
1import React from "react";
2
3import { useList } from "@refinedev/core";
4
5export const List: React.FC = () => {
6 const {
7 data: { data, total },
8 isLoading,
9 } = useList();
10
11 if (isLoading) return <div>Loading...</div>;
12
13 return (
14 <div>
15 <h1>Products</h1>
16 <h3>Showing {total} products in total.</h3>
17 <ul>
18 {data?.map((product) => (
19 <li key={product.id}>
20 <span>{product.name}</span>
21 </li>
22 ))}
23 </ul>
24 </div>
25 );
26};
100% Pure React code

Don’t get locked-in to proprietary, black-box solutions. With Refine you have always 100% control over your project.

Refine on GitHub

Enterprise developers ❤️ Refine.

Refine is designed to target the specific pain points of larger organizations by giving top priority to security.

Self-host for compliance
Deploy to your own infrastructure without worrying about regulations, performance, and stability. Maintain your current security best practices with no compromises.
Leverage the power of your existing Identity Provider
Native support for Okta, Azure AD, Amazon Cognito & Google Cloud Identity.
Achieve fine-grained access control
Out-of-the-box support for widely accepted authorization models including ACL, RBAC & ABAC.
Unlock the black box
Implement an open-source solution with an open architecture. Save yourself from the hassle of adding another proprietary component to your stack.
Effortlessly monitor your application
Ready-made providers and components for audit logging and usage analytics.
Get supported by the experts
Enroll in plans that provide priority support, trainings and consulting.
Check out Enterprise Edition

The difference that Refine makes

I find CRUD boring, but Refine makes it fun for developers again!
Zeno Rocha
Zeno Rocha
CEO - Resend
Refine perfectly aligns with the philosophy of React Hook Form, and they work seamlessly together.
Beier Luo
Beier Luo
Author of React Hook Form
Refine has codemod support for major version transitions, making it easy for users to integrate new versions into their existing codebases seamlessly.
Daniel Del Core
Daniel Del Core
Sr. Software Engineer at Atlassian
Show more

Get started now!

Choose your way to scaffold your project and start developing in seconds.

Use our online GUI to create, customize, and download.

or

Run the npm command in Terminal and follow the wizard instructions.