Better Auth UI

Prerequisites

Install these prerequisites in your project:

Install @better-auth-ui/heroui, @better-auth-ui/react, and @better-auth-ui/core using your preferred package manager.

npm install @better-auth-ui/heroui@latest @better-auth-ui/react@latest @better-auth-ui/core@latest

Add this @import to the global CSS file:

styles/app.css

@import "@better-auth-ui/heroui/styles";

The <Auth /> router includes the built-in authentication views.

Follow a framework-specific guide to integrate Better Auth UI into your project.

Integrate Better Auth UI with TanStack Start

Integrate Better Auth UI with Next.js

Each HeroUI component uses the shared @better-auth-ui/react data layer. Read the React reference to access or change authentication state directly.

Hooks, queries, and mutations for every Better Auth endpoint.