Skip to main content
import { StytchClient, StytchIdentityProvider } from '@stytch/vanilla-js';

const stytch = new StytchClient('public-token-test-be835f9a-ac37-44cf-817d-f58ac2b3ae3d');

const trustedAuthTokenParams = {
  trustedAuthToken: 'eyJ...',
  tokenProfileID: 'token-profile-id',
};

const presentation = {
  theme: { 'font-family': 'Arial' },
};

customElements.define('stytch-identity-provider', StytchIdentityProvider);
// In HTML: <stytch-identity-provider id="stytch-identity-provider" />
document.getElementById('stytch-identity-provider').render({
  client: stytch,
  presentation,
  trustedAuthTokenParams,
});

Documentation Index

Fetch the complete documentation index at: https://stytch.com/docs/llms.txt

Use this file to discover all available pages before exploring further.

If your project is using Trusted Auth Tokens, they can be provided to the component as well. When trustedAuthTokenParams are supplied, the component will exchange the provided token for a session and automatically log the user in before starting the authorization flow. To see all authentication and customization options, see the UI configuration props.