Component Library
The Component Library is still in beta. While in beta, we may make backwards incompatible changes to it, but we’ll make sure to communicate any breaking changes ahead of time.

PropelAuth provides a React-based component library for drop-in authentication. If you’re looking for out-of-the-box authentication with maximum customizability, the component library is the solution for you.

Component Library or Hosted Pages?

PropelAuth provides full UIs that we host on your domain. We consider those signup/login pages to be a really great way to get live quickly, however, it is limited in how deep you can configure it (you cannot, for example, upload your own fonts).

The component library enables you to create your own signup/login pages (replacing the hosted ones), embed it directly in your product, and change any part of it that you want with your own custom React components or CSS.


There are a few concepts you’ll need to understand to make full use of the component library: Components, Elements, and Appearances.

Components contain all the functionality you need for a specific task. For example, you can easily add signup functionality to your application with the Signup component.

Elements are the lower-level primitives that make up a Component, like Buttons and Containers. You can customize Elements with the Appearance object, which lets you apply classes and styles to Elements, or override them completely.

Lastly, you can use Adapter Libraries (coming soon) to adapt our components to the component libraries you already know and use, like MUI.