Ory Elements

Ory Elements is a component library that makes building login, registration and account pages for Ory a breeze:

• Reduces time to add complex auth flows to your customer experience, including multi-factor authentication and account recovery.
• Customizable, themeable, and replaceable components.
• Works with the React ecosystem (Next.js, plain React).
• Dynamically adapts the user interface to your Ory identity schema, sign-in and flow configuration.

Ory Elements has several packages:

• @ory/elements-react
• @ory/nextjs

Note

If you've used @ory/elements, @ory/elements-markup or @ory/elements-preact before, we recommend migrating to @ory/elements-react. The legacy code base is in https://github.com/ory/elements-legacy.

Ory Elements is a set of components that you can use to build your own login, registration, settings, verification, recovery and consent user interface. To just integrate authentication into your Next.js application and use the default user interfaces, follow our guide for Auth.js.

Getting Started

React

npm install @ory/elements-react react react-dom

For more information, see packages/elements-react.

Next.js

npm install @ory/nextjs

For more information, see packages/nextjs.

Example Apps

Full examples are available in the examples/ directory of this repository.

• app router
• pages router