diff --git a/components/EmbedMedia/EmbedMedia.styles.ts b/components/EmbedMedia/EmbedMedia.styles.ts
index b4cf4a41..568e846e 100644
--- a/components/EmbedMedia/EmbedMedia.styles.ts
+++ b/components/EmbedMedia/EmbedMedia.styles.ts
@@ -1,2 +1,4 @@
 export const mediaWrapper = '*:!w-full *:!h-full';
 export const caption = '*:*:leading-display caption mt-1em max-w-prose-wide';
+export const iconWrapper = 'size-50 sm:size-70 bg-black-true/70 border-3 rounded-full border-white group-hocus-within:scale-110 transition group-hocus-within:bg-digital-red';
+export const previewIcon = 'text-white size-24 sm:size-30';
diff --git a/components/EmbedMedia/EmbedMedia.tsx b/components/EmbedMedia/EmbedMedia.tsx
index 19673016..5e2eb457 100644
--- a/components/EmbedMedia/EmbedMedia.tsx
+++ b/components/EmbedMedia/EmbedMedia.tsx
@@ -2,7 +2,9 @@ import { useEffect, useState } from 'react';
 import { cnb } from 'cnbuilder';
 import ReactPlayer from 'react-player/lazy';
 import { Container } from '../Container';
+import { FlexBox } from '../FlexBox';
 import { WidthBox, type WidthType } from '../WidthBox';
+import { HeroIcon } from '../HeroIcon';
 import { type PaddingType } from '@/utilities/datasource';
 import { type MediaAspectRatioType, mediaAspectRatios } from '@/utilities/datasource';
 import * as styles from './EmbedMedia.styles';
@@ -16,8 +18,16 @@ type EmbedMediaProps = React.HTMLAttributes<HTMLDivElement> & {
   spacingTop?: PaddingType;
   spacingBottom?: PaddingType;
   isCaptionInset?: boolean;
+  isPreview?: boolean;
+  previewAriaLabel?: string;
 };
 
+const PlayPreviewIcon = (
+  <FlexBox alignItems="center" justifyContent="center" className={styles.iconWrapper}>
+    <HeroIcon icon="play" noBaseStyle className={styles.previewIcon} />
+  </FlexBox>
+);
+
 export const EmbedMedia = ({
   mediaUrl,
   caption,
@@ -27,6 +37,8 @@ export const EmbedMedia = ({
   spacingTop,
   spacingBottom,
   isCaptionInset,
+  isPreview,
+  previewAriaLabel,
   className,
   ...props
 }: EmbedMediaProps) => {
@@ -59,6 +71,13 @@ export const EmbedMedia = ({
               height="100%"
               url={mediaUrl}
               controls
+              playsinline
+              light={isPreview ? true : false}
+              playing={isPreview ? true : false}
+              playIcon={isPreview ? PlayPreviewIcon : undefined}
+              // This previewAriaLabel prop is not documented but it is in the React Player source code
+              previewAriaLabel={isPreview ? previewAriaLabel : undefined}
+              className="group"
             />
           )}
         </div>
diff --git a/components/FeaturedStories/FeatureMasonry.tsx b/components/FeaturedStories/FeatureMasonry.tsx
index ce0224ea..1d78917b 100644
--- a/components/FeaturedStories/FeatureMasonry.tsx
+++ b/components/FeaturedStories/FeatureMasonry.tsx
@@ -20,6 +20,7 @@ type FeatureMasonryProps = React.HTMLAttributes<HTMLDivElement> & {
   imageFocus1?: string;
   imageAlt1?: string;
   videoUrl?: string;
+  previewAriaLabel?: string;
   caption?: string;
 }
 
@@ -34,6 +35,7 @@ export const FeatureMasonry = ({
   imageFocus1,
   imageAlt1,
   videoUrl,
+  previewAriaLabel,
   caption,
   className,
   ...props
@@ -92,8 +94,10 @@ export const FeatureMasonry = ({
         </div>
         <EmbedMedia
           mediaUrl={videoUrl}
+          isPreview
           className="lg:col-span-6 bg-black-70"
           aspectRatio="16x9"
+          previewAriaLabel={previewAriaLabel}
         />
       </Grid>
       <Text variant="caption" leading="display" className="text-black-70 max-w-prose-wide mt-1em whitespace-pre-line">
diff --git a/components/HeroIcon/HeroIcon.styles.tsx b/components/HeroIcon/HeroIcon.styles.tsx
index 69ee5a2b..b8056cb3 100644
--- a/components/HeroIcon/HeroIcon.styles.tsx
+++ b/components/HeroIcon/HeroIcon.styles.tsx
@@ -21,7 +21,7 @@ import {
   XMarkIcon,
 } from '@heroicons/react/24/outline';
 import { CheckIcon } from '@heroicons/react/16/solid';
-import { PlayIcon } from '@heroicons/react/24/solid';
+import { PlayIcon } from '@heroicons/react/20/solid';
 
 export const iconMap = {
   action: ChevronRightIcon,
@@ -50,7 +50,7 @@ export const iconMap = {
   minus: MinusIcon,
   more: ArrowRightIcon,
   pause: PauseCircleIcon,
-  play: PlayCircleIcon,
+  play: PlayIcon,
   'play-outline': PlayCircleIcon,
   plus: PlusIcon,
   right: ArrowRightIcon,
diff --git a/components/Storyblok/SbEmbedMedia.tsx b/components/Storyblok/SbEmbedMedia.tsx
index 63ab971f..73252ed6 100644
--- a/components/Storyblok/SbEmbedMedia.tsx
+++ b/components/Storyblok/SbEmbedMedia.tsx
@@ -19,6 +19,8 @@ type SbEmbedMediaProps = {
     spacingBottom?: PaddingType;
     isCaptionInset?: boolean;
     isCaptionLight?: boolean;
+    isPreview?: boolean;
+    previewAriaLabel?: string;
   };
 };
 
@@ -33,6 +35,8 @@ export const SbEmbedMedia = ({
     spacingBottom,
     isCaptionInset,
     isCaptionLight,
+    isPreview,
+    previewAriaLabel = 'Play video',
   },
   blok,
 }: SbEmbedMediaProps) => {
@@ -49,6 +53,8 @@ export const SbEmbedMedia = ({
       spacingTop={spacingTop}
       spacingBottom={spacingBottom}
       isCaptionInset={isCaptionInset}
+      isPreview={isPreview}
+      previewAriaLabel={previewAriaLabel}
     />
   );
 };
diff --git a/components/Storyblok/SbFeatureMasonry.tsx b/components/Storyblok/SbFeatureMasonry.tsx
index a68f95ed..2e7a90ee 100644
--- a/components/Storyblok/SbFeatureMasonry.tsx
+++ b/components/Storyblok/SbFeatureMasonry.tsx
@@ -12,6 +12,7 @@ export type SbFeatureMasonryProps = {
     image1?: SbImageType;
     imageAlt1?: string;
     videoUrl?: string;
+    previewAriaLabel?: string;
     caption?: string;
   };
 };
@@ -25,6 +26,7 @@ export const SbFeatureMasonry = ({
     image1: { filename: imageSrc1, focus: imageFocus1 } = {},
     imageAlt1,
     videoUrl,
+    previewAriaLabel = 'Play video',
     caption,
   },
   blok,
@@ -41,6 +43,7 @@ export const SbFeatureMasonry = ({
     imageFocus1={imageFocus1}
     imageAlt1={imageAlt1}
     videoUrl={videoUrl}
+    previewAriaLabel={previewAriaLabel}
     caption={caption}
   />
 );
diff --git a/package-lock.json b/package-lock.json
index 3844aca4..8bc3c291 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "ood-giving-campaign",
-  "version": "1.3.4",
+  "version": "1.3.5",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "ood-giving-campaign",
-      "version": "1.3.4",
+      "version": "1.3.5",
       "dependencies": {
         "@heroicons/react": "^2.1.1",
         "@storyblok/react": "^3.0.8",
@@ -16,7 +16,7 @@
         "framer-motion": "^11.0.24",
         "next": "13.4.9",
         "react-loading-skeleton": "^3.3.1",
-        "react-player": "^2.14.1",
+        "react-player": "^2.15.1",
         "storyblok-rich-text-react-renderer-ts": "^3.2.0",
         "usehooks-ts": "^2.9.1"
       },
@@ -4373,9 +4373,9 @@
       }
     },
     "node_modules/react-player": {
-      "version": "2.14.1",
-      "resolved": "https://registry.npmjs.org/react-player/-/react-player-2.14.1.tgz",
-      "integrity": "sha512-jILj7F9o+6NHzrJ1GqZIxfJgskvGmKeJ05FNhPvgiCpvMZFmFneKEkukywHcULDO2lqITm+zcEkLSq42mX0FbA==",
+      "version": "2.15.1",
+      "resolved": "https://registry.npmjs.org/react-player/-/react-player-2.15.1.tgz",
+      "integrity": "sha512-ni1XFuYZuhIKKdeFII+KRLmIPcvCYlyXvtSMhNOgssdfnSovmakBtBTW2bxowPvmpKy5BTR4jC4CF79ucgHT+g==",
       "dependencies": {
         "deepmerge": "^4.0.0",
         "load-script": "^1.0.0",
diff --git a/package.json b/package.json
index 7f4ee1d2..f78f94bf 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ood-giving-campaign",
-  "version": "1.3.4",
+  "version": "1.3.5",
   "description": "Momentum",
   "author": "Stanford University",
   "keywords": [
@@ -40,7 +40,7 @@
     "framer-motion": "^11.0.24",
     "next": "13.4.9",
     "react-loading-skeleton": "^3.3.1",
-    "react-player": "^2.14.1",
+    "react-player": "^2.15.1",
     "storyblok-rich-text-react-renderer-ts": "^3.2.0",
     "usehooks-ts": "^2.9.1"
   },