Skip to content

Openfort UI Customization

Customize the look and feel of Openfort's UI components to match your brand. Options include:

  • Overriding default styles and themes
  • Customizing modal layout and button appearance

Openfort UI is designed for flexibility—extend or replace components as needed to offer a seamless, branded experience for your users.

<OpenfortProvider 
  uiConfig={
    theme: "YOUR THEME",
    customTheme: { '--ck-font-family': 'monospace' }
    mode: "dark"
 
    {/* other configuration */}
  }
  {/* other props */}
>
  {/* Your app here */}
</OpenfortProvider>

Theme

Choose a theme among one of:

  • auto
  • web95
  • retro
  • soft
  • midnight
  • minimal
  • rounded
  • nouns

Custom Theme

Openfort UI uses ConnectKit, and offers the same theming and customization options. You can edit fonts, colors, and other styling via the theme and customTheme props. For detail, see the ConnectKit docs.

More customization

If you want to customize your authentication further, use the authentication hooks