diff --git a/.changeset/spicy-jars-sparkle.md b/.changeset/spicy-jars-sparkle.md
new file mode 100644
index 0000000000..fd17880372
--- /dev/null
+++ b/.changeset/spicy-jars-sparkle.md
@@ -0,0 +1,5 @@
+---
+"@primer/view-components": patch
+---
+
+Add SR announcement in Summary As Button story
diff --git a/previews/primer/beta/button_preview/summary_as_button.html.erb b/previews/primer/beta/button_preview/summary_as_button.html.erb
index ac5e6686a6..0e0f3790e5 100644
--- a/previews/primer/beta/button_preview/summary_as_button.html.erb
+++ b/previews/primer/beta/button_preview/summary_as_button.html.erb
@@ -1,4 +1,12 @@
-<details>
+<span
+  id="button-summary-live"
+  class="sr-only"
+  role="status"
+  aria-live="polite"
+  aria-atomic="true"></span>
+
+<details
+  ontoggle="document.getElementById('button-summary-live').textContent = this.open ? 'A wrapping `details` tag is required when using the button with the `:summary` tag' : ''">
   <%= render(Primer::Beta::Button.new(
       scheme: scheme,
       size: size,
@@ -9,5 +17,6 @@
   )) do %>
     Button
   <% end %>
+
   <p>A wrapping `details` tag is required when using the button with the `:summary` tag</p>
 </details>