diff --git a/docs/app/helpers/components_helper.rb b/docs/app/helpers/components_helper.rb
index e28916e1a0..4b772e389d 100644
--- a/docs/app/helpers/components_helper.rb
+++ b/docs/app/helpers/components_helper.rb
@@ -411,7 +411,7 @@ def sage_components
         react: "done",
         responsive: "done",
         a11y: "done",
-        react_component_slug: "sage-hero--small-full-bleed",
+        react_component_slug: "sage-hero--small",
         figma_embed: "https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FsMbtLUHSt2vfKgKjyQ3052%2F%25F0%259F%25A7%25A9-Sage-components%3Fnode-id%3D3686%253A21923",
       },
       {
diff --git a/docs/app/views/examples/components/hero/_preview.html.erb b/docs/app/views/examples/components/hero/_preview.html.erb
index 2c1dbd11ea..c41671c064 100644
--- a/docs/app/views/examples/components/hero/_preview.html.erb
+++ b/docs/app/views/examples/components/hero/_preview.html.erb
@@ -39,7 +39,6 @@
 <h2>Borderless</h2>
 <p>When the Hero is set to borderless, the Hero will have no border.</p>
 
-<h3>Full-bleed image</h3>
 <%= sage_component SageHero, {
   title: "Learn with Kajabi in our live workshops",
   description: "Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account.",
@@ -56,25 +55,6 @@
   <% end %>
 <% end %>
 
-<h3>Contained image</h3>
-<%= sage_component SageHero, {
-  title: "Introducing the Kajabi template store",
-  description: "Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account.",
-  image: "hero-contained-placeholder.png",
-  alt_text: "Multi layered illustration of UI elements and woman smiling to the camera",
-  size: "large",
-  contained: true,
-  image_start: true,
-  borderless: true,
-} do %>
-  <% content_for :sage_hero_footer_actions do %>
-    <%= sage_component SageButton, {
-      style: "primary",
-      value: "Learn more",
-    } %>
-  <% end %>
-<% end %>
-
 <%= sage_component SageDivider, {} %>
 
 <h2>Contained</h2>
diff --git a/packages/sage-react/lib/Hero/Hero.story.mdx b/packages/sage-react/lib/Hero/Hero.story.mdx
index 7114b3e546..afd362ff65 100644
--- a/packages/sage-react/lib/Hero/Hero.story.mdx
+++ b/packages/sage-react/lib/Hero/Hero.story.mdx
@@ -28,15 +28,14 @@ Ensure images that are used in the Hero component have alt text that describes t
 
 ## Properties
 
-<ArgsTable story="Small - full-bleed" />
+<ArgsTable story="Small" />
 
-## Full-Bleed Images
-
-### Small - full-bleed
-The small Hero component takes up a portion of the viewport width and image fills the space within the container.
+## Sizes
+There are two sizes for the Hero component: small and large. The small Hero component takes up a portion of the viewport width and the large Hero component takes up the entire viewport width.
 
+### Small
 <Canvas>
-  <Story name="Small - full-bleed">
+  <Story name="Small">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
@@ -50,11 +49,9 @@ The small Hero component takes up a portion of the viewport width and image fill
   </Story>
 </Canvas>
 
-### Large - full-bleed
-The default large Hero component takes up the entire viewport width and image fills the space within the container.
-
+### Large
 <Canvas>
-  <Story name="Large - full-bleed">
+  <Story name="Large">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
@@ -68,37 +65,14 @@ The default large Hero component takes up the entire viewport width and image fi
   </Story>
 </Canvas>
 
-### Image with trigger - full-bleed
-When the image has a trigger, the image is clickable, will trigger an action, and image fills the space within the container.
-
-<Canvas>
-  <Story name="Image with trigger - full-bleed">
-    <Hero
-      title="Learn with Kajabi in our live workshops"
-      description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
-      heroSize="small"
-      image={{
-        src: `${heroFull}`,
-        alt: 'Multi layered illustration of UI elements and woman clasping her hands together in excitement'
-      }}
-      ctaAttributes={{
-        href: '#'
-      }}
-      footerActions={<><Button color="primary">Learn more</Button></>}
-    />
-  </Story>
-</Canvas>
-
-### Borderless and custom background color - full-bleed
-When the Hero is set to borderless and has a custom background color, the Hero will have no border and the background color will be applied to the entire Hero. The image will fill the space within the container.
-
+## Borderless
+When the Hero is set to borderless, the Hero will have no border.
 <Canvas>
-  <Story name="Borderless and custom background color - full-bleed">
+  <Story name="Borderless">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
       heroSize="small"
-      customBackgroundColor="#e6f4fe"
       borderless={true}
       image={{
         src: `${heroFull}`,
@@ -109,49 +83,10 @@ When the Hero is set to borderless and has a custom background color, the Hero w
   </Story>
 </Canvas>
 
-## Contained Images
-Contained images within a Hero component will have margins that push the image away from the sides of the Hero container.
-
-### Small - contained
-
-<Canvas>
-  <Story name="Small - contained">
-    <Hero
-      title="Learn with Kajabi in our live workshops"
-      description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
-      heroSize="small"
-      contained={true}
-      image={{
-        src: `${heroContained}`,
-        alt: 'Multi layered illustration of UI elements and woman smiling to the camera'
-      }}
-      footerActions={<><Button color="primary">Learn more</Button></>}
-    />
-  </Story>
-</Canvas>
-
-### Large - contained
-
-<Canvas>
-  <Story name="Large - contained">
-    <Hero
-      title="Learn with Kajabi in our live workshops"
-      description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
-      heroSize="large"
-      contained={true}
-      image={{
-        src: `${heroContained}`,
-        alt: 'Multi layered illustration of UI elements and woman smiling to the camera'
-      }}
-      footerActions={<><Button color="primary">Learn more</Button></>}
-    />
-  </Story>
-</Canvas>
-
-### Small - contained - trigger
-
+## Contained
+When the Hero is set to contained, the Hero will have margins that push the image away from the sides of the Hero container.
 <Canvas>
-  <Story name="Small - contained - trigger">
+  <Story name="Contained">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
@@ -161,46 +96,21 @@ Contained images within a Hero component will have margins that push the image a
         src: `${heroContained}`,
         alt: 'Multi layered illustration of UI elements and woman smiling to the camera'
       }}
-      ctaAttributes={{
-        href: '#'
-      }}
       footerActions={<><Button color="primary">Learn more</Button></>}
     />
   </Story>
 </Canvas>
 
-### Borderless and custom background color - contained
-
+## Custom Background
+When the Hero has a custom background color, the background color will be applied to the entire Hero.
 <Canvas>
-  <Story name="Borderless and custom background color - contained">
+  <Story name="Custom Background">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
       heroSize="small"
       customBackgroundColor="#e6f4fe"
-      contained={true}
       borderless={true}
-      image={{
-        src: `${heroContained}`,
-        alt: 'Multi layered illustration of UI elements and woman smiling to the camera'
-      }}
-      footerActions={<><Button color="primary">Learn more</Button></>}
-    />
-  </Story>
-</Canvas>
-
-## Image start
-When the image is set to start, the image will be placed at the start of the Hero component.
-
-### Image start - Small
-
-<Canvas>
-  <Story name="Image start - small">
-    <Hero
-      title="Learn with Kajabi in our live workshops"
-      description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
-      heroSize="small"
-      imageStart={true}
       image={{
         src: `${heroFull}`,
         alt: 'Multi layered illustration of UI elements and woman clasping her hands together in excitement'
@@ -210,14 +120,14 @@ When the image is set to start, the image will be placed at the start of the Her
   </Story>
 </Canvas>
 
-### Image start - Large
-
+## Image Start
+When the image is set to start, the image will be placed at the start of the Hero component.
 <Canvas>
-  <Story name="Image start - Large">
+  <Story name="Image Start">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
-      heroSize="large"
+      heroSize="small"
       imageStart={true}
       image={{
         src: `${heroFull}`,
@@ -228,41 +138,24 @@ When the image is set to start, the image will be placed at the start of the Her
   </Story>
 </Canvas>
 
-### Image start - contained - small
+## CTA Attribute
+When the Hero has a CTA attribute, the CTA will be applied to the Hero image.
 
 <Canvas>
-  <Story name="Image start - contained - small">
+  <Story name="CTA Attribute">
     <Hero
       title="Learn with Kajabi in our live workshops"
       description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
       heroSize="small"
-      imageStart={true}
       contained={true}
       image={{
         src: `${heroContained}`,
         alt: 'Multi layered illustration of UI elements and woman smiling to the camera'
       }}
-      footerActions={<><Button color="primary">Learn more</Button></>}
-    />
-  </Story>
-</Canvas>
-
-
-### Image start - contained - large
-
-<Canvas>
-  <Story name="Image start - contained - large">
-    <Hero
-      title="Learn with Kajabi in our live workshops"
-      description="Did you know we offer free workshops? Kajabi experts host live workshops every week on topics from marketing your products to building out your Kajabi account."
-      heroSize="large"
-      imageStart={true}
-      contained={true}
-      image={{
-        src: `${heroContained}`,
-        alt: 'Multi layered illustration of UI elements and woman smiling to the camera'
+      ctaAttributes={{
+        href: '#'
       }}
       footerActions={<><Button color="primary">Learn more</Button></>}
     />
   </Story>
-</Canvas>
\ No newline at end of file
+</Canvas>