> ## 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.

# Customize Stytch UI

> How to customize Stytch UI to fit the look and feel of your app

Many elements of Stytch UI can be customized. You can use our pre-built, bring your own shadcn/ui themes, or write your own theme. You can also replace any string appearing in Stytch UI. Select your package to see all customization options.

> **[@stytch/vanilla-js](https://stytch.com/docs/api-reference/b2b/frontend-sdks/vanilla-js/prebuilt-ui/theming.md)**

> **[@stytch/nextjs](https://stytch.com/docs/api-reference/b2b/frontend-sdks/nextjs/prebuilt-ui/theming.md)**

> **[@stytch/react](https://stytch.com/docs/api-reference/b2b/frontend-sdks/react/prebuilt-ui/theming.md)**

Here are some examples of customized Stytch UI components:

**Default**

![](https://mintcdn.com/stytch-34ca0595/j0ZekfcvTA5toQr8/images/api-reference/shared/sdk/stytch-ui-light.png?fit=max\&auto=format\&n=j0ZekfcvTA5toQr8\&q=85\&s=3fd77cd65972557b104a1620e189ab7f)

**Dark**

![](https://mintcdn.com/stytch-34ca0595/j0ZekfcvTA5toQr8/images/api-reference/shared/sdk/stytch-ui-dark.png?fit=max\&auto=format\&n=j0ZekfcvTA5toQr8\&q=85\&s=c4d3f4109be48605d1d2e82d44677c6d)

**shadcn - default**

![](https://mintcdn.com/stytch-34ca0595/j0ZekfcvTA5toQr8/images/api-reference/shared/sdk/stytch-ui-shadcn.png?fit=max\&auto=format\&n=j0ZekfcvTA5toQr8\&q=85\&s=6a6af4f3af96bd541321e1c0e5082385)

**shadcn - Neobrutalism**

![](https://mintcdn.com/stytch-34ca0595/j0ZekfcvTA5toQr8/images/api-reference/shared/sdk/stytch-ui-shadcn-neobrutalism.png?fit=max\&auto=format\&n=j0ZekfcvTA5toQr8\&q=85\&s=e783ee450a8756f3b1fb61b24fe72ed3)

[From tweakcn](https://tweakcn.com/editor/theme?theme=neo-brutalism)

**shadcn - Bubblegum**

![](https://mintcdn.com/stytch-34ca0595/j0ZekfcvTA5toQr8/images/api-reference/shared/sdk/stytch-ui-shadcn-bubblegum.png?fit=max\&auto=format\&n=j0ZekfcvTA5toQr8\&q=85\&s=72bc5abc759db017c276f8761f80505a)

[From tweakcn](https://tweakcn.com/editor/theme?theme=bubblegum)

**shadcn - Amethyst dark**

![](https://mintcdn.com/stytch-34ca0595/j0ZekfcvTA5toQr8/images/api-reference/shared/sdk/stytch-ui-shadcn-amethyst-dark.png?fit=max\&auto=format\&n=j0ZekfcvTA5toQr8\&q=85\&s=0a89a21ce9ba4b38522149d9faa09759)

[From tweakcn](https://tweakcn.com/editor/theme?theme=amethyst-haze)