# ory-login-flow

> Claude/Codex skill by [@ory](https://omgskills.com/library/ory/index.md) · 3 stars · Updated 2026-09-30

Build login, registration, account recovery, email verification, and account settings pages using Ory Elements. Use whenever the user asks for a login page, sign-in UI, sign-up form, "forgot password" flow, account settings page, or wants to wire Ory's self-service flows into a frontend. Ory Elements is the default rendering layer; only fall back to custom UI nodes if Elements cannot run in the target environment.

## Install

```sh
git clone https://github.com/ory/claude-plugins /tmp/claude-plugins && ln -s /tmp/claude-plugins/plugins/ory-agent-plugin/skills/ory-login-flow ~/.claude/skills/ory-login-flow
```

## From README

Build Auth Pages with Ory Elements You are building login, registration, recovery, verification, and settings pages using Ory Elements — a prebuilt UI component library that renders Ory's self-service flows. Default rule: every page in this guide is rendered with Ory Elements. Do not hand-roll forms from flow.ui.nodes unless the user has explicitly opted out after seeing the Ory Elements path. Custom node rendering belongs in the fallback section at the end of this skill. Why Ory Elements One component per flow ( , , , , ) covers the entire self-service surface. Handles CSRF tokens, error messages, multi-step states, social buttons, passkeys, and MFA prompts automatically. New node types and flow capabilities ship with Elements upgrades — no per-app rewrite needed. Works in Next.js (App Router and Pages Router) and any React SPA.

## Links

- HTML page: https://omgskills.com/library/ory/claude-plugins/plugins/ory-agent-plugin/skills/ory-login-flow/
- GitHub: https://github.com/ory/claude-plugins
- Author: [@ory](https://omgskills.com/library/ory/index.md)

## More from this repo

- [ory-auth-setup](https://omgskills.com/library/ory/claude-plugins/plugins/ory-agent-plugin/skills/ory-auth-setup/index.md) — Set up a complete authentication system using Ory Network with Ory Elements as the UI layer.
   - [@ory](https://omgskills.com/library/ory/index.md) · 3 stars
- [ory-build-agent](https://omgskills.com/library/ory/claude-plugins/plugins/ory-agent-plugin/skills/ory-build-agent/index.md) — Used to build your own AI agent that authenticates the user, authorizes every tool call against Ory Permissions, and...
   - [@ory](https://omgskills.com/library/ory/index.md) · 3 stars
- [ory-build-integration](https://omgskills.com/library/ory/claude-plugins/plugins/ory-agent-plugin/skills/ory-build-integration/index.md) — Wire an Ory Network integration into your own application using the ory/integrates template patterns.
   - [@ory](https://omgskills.com/library/ory/index.md) · 3 stars