Skip to content

Hosted pages or your own UI

There are two places your sign-in UI can live, and you can use either or both:

  • Shrines, the hosted portal — Torii serves ready-made sign-in, sign-up, and account pages on a host under your own domain. You link to them. No UI code.
  • Your own app — you mount <SignIn> and the other components inside your React tree and own the surrounding page.
Hosted portal Your own app
Sign-in page lives on shrines.yourdomain.com (a host Torii serves) any route in your app, e.g. /login
UI code you write none mount the components, own the page around them
Branding color scheme + two brand colors, set in the dashboard full control — theming, element overrides, labels
Layout around the card fixed (centered card) yours
Users leave your site to sign in yes, to a subdomain of your domain no
Good for shipping fast, backends and APIs with no frontend of their own, internal tools product surfaces where the sign-in page is part of the experience

Pick the hosted portal when auth is a means to an end and you would rather not own a login page. Pick your own UI when the sign-in screen is somewhere you want design control — a marketing-adjacent landing, a split-screen layout, custom copy per locale.

Nothing is exclusive. A common shape is the hosted portal for sign-in and sign-up, and your own app for the account surfaces — mount <UserButton> or <UserProfile> in your app’s header and settings page, and send users to the portal only to authenticate.

The reverse works too: mount <SignIn> in your app and leave the portal enabled as a fallback entry point. Or turn the portal off entirely once your own pages are live.