diff --git a/src/assets/faqmaker.png b/public/faqmaker.png
similarity index 100%
rename from src/assets/faqmaker.png
rename to public/faqmaker.png
diff --git a/src/assets/faqmaker.svg b/public/faqmaker.svg
similarity index 100%
rename from src/assets/faqmaker.svg
rename to public/faqmaker.svg
diff --git a/src/assets/google.svg b/public/google.svg
similarity index 100%
rename from src/assets/google.svg
rename to public/google.svg
diff --git a/src/app/login/page.tsx b/src/app/login/page.tsx
index 7b41df944..24d7b3e2f 100644
--- a/src/app/login/page.tsx
+++ b/src/app/login/page.tsx
@@ -2,7 +2,6 @@ import Image from 'next/image';
 import Link from 'next/link';
 
 import { signInAction } from '@/actions';
-import googleIcon from '@/assets/google.svg';
 import { Button } from '@/components';
 import { Routes } from '@/utils';
 
@@ -64,7 +63,7 @@ export default function Page({ searchParams }) {
           weight="bold"
           type="submit"
         >
-          <Image src={googleIcon} alt="" width={28} height={28} />
+          <Image src="/google.svg" alt="" width={28} height={28} />
           Sign In with Google
         </Button>
       </form>
diff --git a/src/components/emails/NewUser.tsx b/src/components/emails/InviteUser.tsx
similarity index 88%
rename from src/components/emails/NewUser.tsx
rename to src/components/emails/InviteUser.tsx
index 4b3c892ef..af0157cc4 100644
--- a/src/components/emails/NewUser.tsx
+++ b/src/components/emails/InviteUser.tsx
@@ -21,7 +21,7 @@ interface Props {
   invitedByEmail: string;
 }
 
-export const NewUserEmailTemplate = ({
+export const FaqmakerInviteUserEmail = ({
   company,
   username,
   invitedByUsername,
@@ -38,7 +38,7 @@ export const NewUserEmailTemplate = ({
           <Container className="mx-auto my-10 max-w-lg rounded-md border border-solid border-neutral-500 p-5">
             <Section className="mt-8">
               <Img
-                src={`${process.env.NEXT_PUBLIC_AWS_CLOUDFRONT_URL}/common/faqmaker.png`}
+                src="/faqmaker.png"
                 width="48"
                 height="48"
                 alt="FAQMaker"
@@ -48,7 +48,7 @@ export const NewUserEmailTemplate = ({
             <Heading className="mx-0 p-0 text-center text-2xl font-normal">
               Join <strong>{company}</strong> on <strong>FAQMaker</strong>
             </Heading>
-            <Text>Hello XXX,</Text>
+            <Text>Hi {username},</Text>
             <Text>
               <strong>{invitedByUsername}</strong> (
               <Link
@@ -84,4 +84,11 @@ export const NewUserEmailTemplate = ({
   );
 };
 
-export default NewUserEmailTemplate;
+FaqmakerInviteUserEmail.PreviewProps = {
+  username: 'alanturing',
+  company: 'Enigma',
+  invitedByUsername: 'Alan',
+  invitedByEmail: 'alan.turing@example.com',
+} as Props;
+
+export default FaqmakerInviteUserEmail;
diff --git a/src/components/emails/Register.tsx b/src/components/emails/Register.tsx
index 0262b8a1a..0c02614c1 100644
--- a/src/components/emails/Register.tsx
+++ b/src/components/emails/Register.tsx
@@ -1,5 +1,64 @@
-export const RegisterEmailTemplate = () => (
-  <div>
-    <h1>Welcome to FAQMaker</h1>
-  </div>
-);
+import {
+  Body,
+  Button,
+  Container,
+  Head,
+  Html,
+  Img,
+  Preview,
+  Section,
+  Tailwind,
+  Text,
+} from '@react-email/components';
+
+interface Props {
+  company: string;
+}
+
+export const RegisterEmailTemplate = ({ company }: Props) => {
+  const previewText = `Join XXX on FAQMaker`;
+
+  return (
+    <Html>
+      <Head />
+      <Preview>{previewText}</Preview>
+      <Tailwind>
+        <Body className="mx-auto my-auto bg-neutral-100 p-2 font-sans text-base text-neutral-950">
+          <Container className="mx-auto my-10 max-w-lg rounded-md border border-solid border-neutral-500 p-5">
+            <Section className="mt-8">
+              <Img
+                src="/faqmaker.png"
+                width="48"
+                height="48"
+                alt="FAQMaker"
+                className="mx-auto my-0"
+              />
+            </Section>
+            <Text>Hi {company},</Text>
+            <Text>
+              Welcome to <strong>FAQMaker</strong>,
+            </Text>
+            <Section className="text-center">
+              <Button
+                className="w-fit rounded-md bg-neutral-950 px-4 py-2 text-base font-semibold lowercase text-neutral-100"
+                style={{ fontVariant: 'small-caps' }}
+                href={`${process.env.NEXTAUTH_URL}/login`}
+              >
+                Get Started
+              </Button>
+            </Section>
+            <Section>
+              <Text>
+                Best,
+                <br />
+                The FAQMaker team
+              </Text>
+            </Section>
+          </Container>
+        </Body>
+      </Tailwind>
+    </Html>
+  );
+};
+
+export default RegisterEmailTemplate;
diff --git a/src/components/emails/index.ts b/src/components/emails/index.ts
index 95fd743ad..22491c58b 100644
--- a/src/components/emails/index.ts
+++ b/src/components/emails/index.ts
@@ -1,2 +1,2 @@
 export * from './Register';
-export * from './NewUser';
+export * from './InviteUser';
