UIAccount
Verification code
A focused one-time code with a clear expiry.
Email preview
FromAcme <hello@acme.com>SubjectYour verification codePreview482 901 is your verification code
Installation
npx shadcn@latest add https://email-sdk.dev/r/verification-code.jsonCopy this template into your app and customize its props, words, and links.
import {
EmailCard,
EmailHeading,
EmailText,
ShadcnEmail,
} from "@opencoredev/email-sdk/react";
export function VerificationCodeEmail({ code }: { code: string }) {
return (
<ShadcnEmail preview={`${code} is your verification code`}>
<EmailCard>
<EmailHeading>Verify your email</EmailHeading>
<EmailText>Enter this code to finish signing in. It expires in 10 minutes.</EmailText>
<EmailText style={{
backgroundColor: "#f4f4f5",
borderRadius: 8,
fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
fontSize: 28,
fontWeight: 700,
letterSpacing: 8,
padding: "18px 20px",
textAlign: "center",
}}>
{code}
</EmailText>
<EmailText muted>If you didn’t request this code, ignore this email.</EmailText>
</EmailCard>
</ShadcnEmail>
);
}