Component Reference
Clerk offers a comprehensive suite of components designed to seamlessly integrate authentication and multi-tenancy into your application. With Clerk components, you can easily customize the appearance of authentication components and pages, manage the entire authentication flow to suit your specific needs, and even build robust SaaS applications.
Expo apps can target both native (iOS/Android) and web surfaces, and Clerk ships a distinct component suite for each. Select your target platform to see the components available to it.
For native Expo apps, Clerk provides a dedicated suite of components rendered with SwiftUI on iOS and Jetpack Compose on Android. These are distinct from the web UI components — they don't run on Expo web.
See the native components overview for installation, requirements, and theming.
You can also use Clerk's control components — <ClerkLoaded />, <ClerkLoading />, and <Show /> — in native apps. They manage conditional rendering based on authentication state and render no UI of their own.
The components below are Clerk's web UI components. Most don't work in native builds — if you're building for iOS or Android, switch to the Expo native tab, which also names the control components that do.
Authentication components
User components
Organization components
Billing components
Control components
Control components manage authentication-related behaviors in your application. They handle tasks such as controlling content visibility based on user authentication status, managing loading states during authentication processes, and redirecting users to appropriate pages. A common example is the <Show /> component, which allows you to conditionally render content based on authentication and authorization state.
Unstyled components
Utilities components
Customization guides
-
Customize components with the
appearanceprop - Localize components with the
localizationprop -
Add pages to the
<UserProfile />component -
Add pages to the
<OrganizationProfile />component
Secured by Clerk branding
By default, Clerk displays a Secured by Clerk badge on its prebuilt UI. You can remove this branding by following these steps:
- In the Clerk Dashboard, navigate to your application's Settings.
- Under Branding, toggle on the Remove "Secured by Clerk" branding option.
Join the Discord community
Join the official Discord community to connect with other developers.
Feedback
Last updated on