Zitadel Preview Docs
SDKs

Components

Shared web components used by framework SDKs.

@zitadel/components contains Lit web components and the <zitadel-login> orchestrator used by framework SDKs.

Framework SDKs wrap this package

Most applications should install the framework SDK first. Use this package directly when embedding the web components yourself.

Install

pnpm add @zitadel/components
npm install @zitadel/components
yarn add @zitadel/components

Components

  • <zitadel-login>
  • <zitadel-logout>
  • atoms such as fields, buttons, alerts, icons, pills, and page shells

Runtime model

Configure the project once with a project id and proxy path.
Render the login orchestrator for login or registration flows.
The component calls the flow API, renders each step, manages focus, and submits with native form semantics.

The components speak to the configured API base, usually the same-origin /__nextgen proxy path in generated apps.

For browser automation, remember that the native controls live inside shadow roots. Prefer Playwright-style shadow-DOM-aware locators when available.

See also

On this page