# Password reset (/docs/ui/account/password-reset)



<EmailExample id="password-reset" />

## Installation [#installation]

<Tabs items="[&#x22;CLI&#x22;, &#x22;Manual&#x22;]">
  <Tab value="CLI">
    ```bash
    npx shadcn@latest add https://email-sdk.dev/r/password-reset.json
    ```
  </Tab>

  <Tab value="Manual">
    Copy this template into your app and customize its props, words, and links.

    ```tsx title="src/ui/email/password-reset.tsx"
    import {
      EmailButton,
      EmailCard,
      EmailHeading,
      EmailText,
      ShadcnEmail,
    } from "@opencoredev/email-sdk/react";

    export function PasswordResetEmail({ resetUrl }: { resetUrl: string }) {
      return (
        <ShadcnEmail preview="Reset your password within the next 30 minutes">
          <EmailCard>
            <EmailHeading>Reset your password</EmailHeading>
            <EmailText>
              We received a request to reset the password for your Acme account.
            </EmailText>
            <EmailButton href={resetUrl}>Reset password</EmailButton>
            <EmailText muted style={{ fontSize: 13, marginTop: 20 }}>
              This link expires in 30 minutes. The request came from Safari on macOS.
            </EmailText>
          </EmailCard>
        </ShadcnEmail>
      );
    }
    ```
  </Tab>
</Tabs>
