diff --git a/apps/web/pages/api/email.ts b/apps/web/pages/api/email.ts
index e353dfa4c6..6e99a6e77e 100644
--- a/apps/web/pages/api/email.ts
+++ b/apps/web/pages/api/email.ts
@@ -60,7 +60,7 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => {
   res.setHeader("Content-Type", "text/html");
   res.setHeader("Cache-Control", "no-cache, no-store, private, must-revalidate");
   res.write(
-    renderEmail("OrganizerScheduledEmail", {
+    renderEmail("OrganizerRequestEmail", {
       calEvent: evt,
       attendee: evt.organizer,
     })
diff --git a/apps/web/public/emails/confirmIcon.png b/apps/web/public/emails/confirmIcon.png
new file mode 100644
index 0000000000..d20ec56445
Binary files /dev/null and b/apps/web/public/emails/confirmIcon.png differ
diff --git a/apps/web/public/emails/confirmIcon.svg b/apps/web/public/emails/confirmIcon.svg
new file mode 100644
index 0000000000..16e6b00573
--- /dev/null
+++ b/apps/web/public/emails/confirmIcon.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+  <path stroke="white" stroke-linecap="round" stroke-linejoin="round" d="M4.5 12.75l6 6 9-13.5" />
+</svg>
diff --git a/apps/web/public/emails/rejectIcon.png b/apps/web/public/emails/rejectIcon.png
new file mode 100644
index 0000000000..da19051177
Binary files /dev/null and b/apps/web/public/emails/rejectIcon.png differ
diff --git a/apps/web/public/emails/rejectIcon.svg b/apps/web/public/emails/rejectIcon.svg
new file mode 100644
index 0000000000..bd2446ce30
--- /dev/null
+++ b/apps/web/public/emails/rejectIcon.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
+  <path stroke="white" stroke-linecap="round" stroke-linejoin="round" d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636" />
+</svg>
diff --git a/packages/emails/src/components/CallToAction.tsx b/packages/emails/src/components/CallToAction.tsx
index 0ba00f1b96..04007623c7 100644
--- a/packages/emails/src/components/CallToAction.tsx
+++ b/packages/emails/src/components/CallToAction.tsx
@@ -1,33 +1,76 @@
-import { LinkIcon } from "./LinkIcon";
+import { CallToActionIcon } from "./CallToActionIcon";
 
-export const CallToAction = (props: { label: string; href: string; secondary?: boolean }) => (
-  <p
-    style={{
-      display: "inline-block",
-      background: props.secondary ? "#FFFFFF" : "#292929",
-      border: props.secondary ? "1px solid #d1d5db" : "",
-      color: "#ffffff",
-      fontFamily: "Roboto, Helvetica, sans-serif",
-      fontSize: "14px",
-      fontWeight: 500,
-      lineHeight: "20px",
-      margin: 0,
-      textDecoration: "none",
-      textTransform: "none",
-      padding: "16px 24px",
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
-      msoPaddingAlt: "0px",
-      borderRadius: "6px",
-      boxSizing: "border-box",
-    }}>
-    <a
-      style={{ color: props.secondary ? "#292929" : "#FFFFFF", textDecoration: "none" }}
-      href={props.href}
-      target="_blank"
-      rel="noreferrer">
-      {props.label}
-      <LinkIcon secondary={props.secondary} />
-    </a>
-  </p>
-);
+export const CallToAction = (props: {
+  label: string;
+  href: string;
+  secondary?: boolean;
+  startIconName?: string;
+  endIconName?: string;
+}) => {
+  const { label, href, secondary, startIconName, endIconName } = props;
+
+  const calculatePadding = () => {
+    const paddingTop = "0.625rem";
+    const paddingBottom = "0.625rem";
+    let paddingLeft = "1rem";
+    let paddingRight = "1rem";
+
+    if (startIconName) {
+      paddingLeft = "0.875rem";
+    } else if (endIconName) {
+      paddingRight = "0.875rem";
+    }
+
+    return `${paddingTop} ${paddingRight} ${paddingBottom} ${paddingLeft}`;
+  };
+
+  return (
+    <p
+      style={{
+        display: "inline-block",
+        background: secondary ? "#FFFFFF" : "#292929",
+        border: secondary ? "1px solid #d1d5db" : "",
+        color: "#ffffff",
+        fontFamily: "Roboto, Helvetica, sans-serif",
+        fontSize: "0.875rem",
+        fontWeight: 500,
+        lineHeight: "1rem",
+        margin: 0,
+        textDecoration: "none",
+        textTransform: "none",
+        padding: calculatePadding(),
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        msoPaddingAlt: "0px",
+        borderRadius: "6px",
+        boxSizing: "border-box",
+        height: "2.25rem",
+      }}>
+      <a
+        style={{
+          color: secondary ? "#292929" : "#FFFFFF",
+          textDecoration: "none",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          margin: "auto",
+        }}
+        href={href}
+        target="_blank"
+        rel="noreferrer">
+        {startIconName && (
+          <CallToActionIcon
+            style={{
+              marginRight: "0.5rem",
+              marginLeft: 0,
+            }}
+            iconName={startIconName}
+            secondary={secondary}
+          />
+        )}
+        {label}
+        {endIconName && <CallToActionIcon iconName={endIconName} secondary={secondary} />}
+      </a>
+    </p>
+  );
+};
diff --git a/packages/emails/src/components/CallToActionIcon.tsx b/packages/emails/src/components/CallToActionIcon.tsx
new file mode 100644
index 0000000000..c90be53867
--- /dev/null
+++ b/packages/emails/src/components/CallToActionIcon.tsx
@@ -0,0 +1,27 @@
+import React from "react";
+
+import { WEBAPP_URL } from "@calcom/lib/constants";
+
+export const CallToActionIcon = ({
+  secondary,
+  iconName,
+  style,
+}: {
+  secondary?: boolean;
+  iconName: string;
+  style?: React.CSSProperties;
+}) => (
+  <img
+    src={`${WEBAPP_URL}/emails/${iconName}.png`}
+    srcSet={`${WEBAPP_URL}/emails/${iconName}.svg`}
+    width="1rem"
+    style={{
+      height: "1rem",
+      width: "1rem",
+      marginLeft: "0.5rem",
+      ...(secondary && { filter: "brightness(50%)" }),
+      ...style,
+    }}
+    alt=""
+  />
+);
diff --git a/packages/emails/src/components/LinkIcon.tsx b/packages/emails/src/components/LinkIcon.tsx
deleted file mode 100644
index 190da6aee0..0000000000
--- a/packages/emails/src/components/LinkIcon.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import { BASE_URL, IS_PRODUCTION } from "@calcom/lib/constants";
-
-export const LinkIcon = ({ secondary }: { secondary?: boolean }) => (
-  <img
-    src={IS_PRODUCTION ? BASE_URL + "/emails/linkIcon.png" : "https://app.cal.com/emails/linkIcon.png"}
-    srcSet={IS_PRODUCTION ? BASE_URL + "/emails/linkIcon.svg" : "https://app.cal.com/emails/linkIcon.svg"}
-    width="16px"
-    style={{ marginBottom: "-3px", marginLeft: "8px", ...(secondary && { filter: "brightness(80%)" }) }}
-    alt=""
-  />
-);
diff --git a/packages/emails/src/components/LocationInfo.tsx b/packages/emails/src/components/LocationInfo.tsx
index b8bf8d7c54..fe69bf5813 100644
--- a/packages/emails/src/components/LocationInfo.tsx
+++ b/packages/emails/src/components/LocationInfo.tsx
@@ -5,8 +5,8 @@ import { getVideoCallUrl } from "@calcom/lib/CalEventParser";
 import logger from "@calcom/lib/logger";
 import type { CalendarEvent } from "@calcom/types/Calendar";
 
+import { CallToActionIcon } from "./CallToActionIcon";
 import { Info } from "./Info";
-import { LinkIcon } from "./LinkIcon";
 
 export function LocationInfo(props: { calEvent: CalendarEvent; t: TFunction }) {
   const { t } = props;
@@ -40,7 +40,7 @@ export function LocationInfo(props: { calEvent: CalendarEvent; t: TFunction }) {
             title={t("meeting_url")}
             style={{ color: "#101010" }}
             rel="noreferrer">
-            {providerName || "Link"} <LinkIcon />
+            {providerName || "Link"} <CallToActionIcon iconName="linkIcon" />
           </a>
         }
         extraInfo={
diff --git a/packages/emails/src/components/index.ts b/packages/emails/src/components/index.ts
index bfbe24f865..de16cac108 100644
--- a/packages/emails/src/components/index.ts
+++ b/packages/emails/src/components/index.ts
@@ -4,7 +4,7 @@ export { CallToAction } from "./CallToAction";
 export { CallToActionTable } from "./CallToActionTable";
 export { UserFieldsResponses } from "./UserFieldsResponses";
 export { Info } from "./Info";
-export { LinkIcon } from "./LinkIcon";
+export { CallToActionIcon } from "./CallToActionIcon";
 export { LocationInfo } from "./LocationInfo";
 export { ManageLink } from "./ManageLink";
 export { default as RawHtml } from "./RawHtml";
diff --git a/packages/emails/src/templates/AttendeeAwaitingPaymentEmail.tsx b/packages/emails/src/templates/AttendeeAwaitingPaymentEmail.tsx
index 4a593f5970..a02408cd22 100644
--- a/packages/emails/src/templates/AttendeeAwaitingPaymentEmail.tsx
+++ b/packages/emails/src/templates/AttendeeAwaitingPaymentEmail.tsx
@@ -8,7 +8,7 @@ function ManageLink(props: React.ComponentProps<typeof AttendeeScheduledEmail>)
 
   return (
     <CallToActionTable>
-      <CallToAction label={manageText} href={props.calEvent.paymentInfo.link} />
+      <CallToAction label={manageText} href={props.calEvent.paymentInfo.link} endIconName="linkIcon" />
     </CallToActionTable>
   );
 }
diff --git a/packages/emails/src/templates/AttendeeWasRequestedToRescheduleEmail.tsx b/packages/emails/src/templates/AttendeeWasRequestedToRescheduleEmail.tsx
index 763057d74e..256e77596b 100644
--- a/packages/emails/src/templates/AttendeeWasRequestedToRescheduleEmail.tsx
+++ b/packages/emails/src/templates/AttendeeWasRequestedToRescheduleEmail.tsx
@@ -17,7 +17,7 @@ export const AttendeeWasRequestedToRescheduleEmail = (
     subject="rescheduled_event_type_subject"
     callToAction={
       <CallToActionTable>
-        <CallToAction label="Book a new time" href={props.metadata.rescheduleLink} />
+        <CallToAction label="Book a new time" href={props.metadata.rescheduleLink} endIconName="linkIcon" />
       </CallToActionTable>
     }
     {...props}
diff --git a/packages/emails/src/templates/OrganizerRequestEmail.tsx b/packages/emails/src/templates/OrganizerRequestEmail.tsx
index ab441b27dc..9454aaf1c6 100644
--- a/packages/emails/src/templates/OrganizerRequestEmail.tsx
+++ b/packages/emails/src/templates/OrganizerRequestEmail.tsx
@@ -1,7 +1,7 @@
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { symmetricEncrypt } from "@calcom/lib/crypto";
 
-import { CallToAction, CallToActionTable, Separator } from "../components";
+import { CallToAction, Separator, CallToActionTable } from "../components";
 import { OrganizerScheduledEmail } from "./OrganizerScheduledEmail";
 
 export const OrganizerRequestEmail = (props: React.ComponentProps<typeof OrganizerScheduledEmail>) => {
@@ -21,13 +21,15 @@ export const OrganizerRequestEmail = (props: React.ComponentProps<typeof Organiz
       callToAction={
         <CallToActionTable>
           <CallToAction
-            label={props.calEvent.organizer.language.translate("accept")}
+            label={props.calEvent.organizer.language.translate("confirm")}
             href={`${actionHref}&action=accept`}
+            startIconName="confirmIcon"
           />
           <Separator />
           <CallToAction
             label={props.calEvent.organizer.language.translate("reject")}
             href={`${actionHref}&action=reject`}
+            startIconName="rejectIcon"
             secondary
           />
         </CallToActionTable>
diff --git a/packages/emails/src/templates/TeamInviteEmail.tsx b/packages/emails/src/templates/TeamInviteEmail.tsx
index f6e0a5c92e..a99b805c51 100644
--- a/packages/emails/src/templates/TeamInviteEmail.tsx
+++ b/packages/emails/src/templates/TeamInviteEmail.tsx
@@ -55,6 +55,7 @@ export const TeamInviteEmail = (
         <CallToAction
           label={props.language(props.isCalcomMember ? "email_user_cta" : "email_no_user_cta")}
           href={props.joinLink}
+          endIconName="linkIcon"
         />
       </div>
       <p