diff --git a/installer/templates/phx_web/components/core_components.ex b/installer/templates/phx_web/components/core_components.ex
index f5ba025411..d18398a842 100644
--- a/installer/templates/phx_web/components/core_components.ex
+++ b/installer/templates/phx_web/components/core_components.ex
@@ -163,20 +163,25 @@ defmodule <%= @web_namespace %>.CoreComponents do
 
   def button(assigns) do
     ~H"""
-    <button
-      type={@type}
-      class={[
-        "phx-submit-loading:opacity-75 rounded-lg bg-zinc-900 hover:bg-zinc-700 py-2 px-3",
-        "text-sm font-semibold leading-6 text-white active:text-white/80",
-        @class
-      ]}
-      {@rest}
-    >
+    <button type={@type} class={[button_classes(), @class]} {@rest}>
       {render_slot(@inner_block)}
     </button>
     """
   end
 
+  @doc """
+  Returns the default button classes.
+
+  ## Examples
+
+      <.link class={button_classes()} href={~p"/items/new"}>
+        New Item
+      </.link>
+  """
+  def button_classes do
+    "inline-block phx-submit-loading:opacity-75 rounded-lg bg-zinc-900 hover:bg-zinc-700 py-2 px-3 text-sm font-semibold leading-6 text-white active:text-white/80"
+  end
+
   @doc """
   Renders an input with label and error messages.
 
diff --git a/priv/templates/phx.gen.html/index.html.heex b/priv/templates/phx.gen.html/index.html.heex
index feec52ee5d..3e70d52aa3 100644
--- a/priv/templates/phx.gen.html/index.html.heex
+++ b/priv/templates/phx.gen.html/index.html.heex
@@ -1,11 +1,9 @@
 <.header>
   Listing <%= schema.human_plural %>
   <:actions>
-    <.button phx-click={JS.dispatch("click", to: {:inner, "a"})}>
-      <.link href={~p"<%= schema.route_prefix %>/new"}>
-        New <%= schema.human_singular %>
-      </.link>
-    </.button>
+    <.link class={button_classes()} href={~p"<%= schema.route_prefix %>/new"}>
+      New <%= schema.human_singular %>
+    </.link>
   </:actions>
 </.header>
 
diff --git a/priv/templates/phx.gen.html/show.html.heex b/priv/templates/phx.gen.html/show.html.heex
index ec3f7774aa..a9e15ad98d 100644
--- a/priv/templates/phx.gen.html/show.html.heex
+++ b/priv/templates/phx.gen.html/show.html.heex
@@ -2,11 +2,9 @@
   <%= schema.human_singular %> {@<%= schema.singular %>.id}
   <:subtitle>This is a <%= schema.singular %> record from your database.</:subtitle>
   <:actions>
-    <.button phx-click={JS.dispatch("click", to: {:inner, "a"})}>
-      <.link href={~p"<%= schema.route_prefix %>/#{@<%= schema.singular %>}/edit"}>
-        Edit <%= schema.singular %>
-      </.link>
-    </.button>
+    <.link class={button_classes()} href={~p"<%= schema.route_prefix %>/#{@<%= schema.singular %>}/edit"}>
+      Edit <%= schema.singular %>
+    </.link>
   </:actions>
 </.header>
 
diff --git a/priv/templates/phx.gen.live/core_components.ex b/priv/templates/phx.gen.live/core_components.ex
index f5ba025411..d18398a842 100644
--- a/priv/templates/phx.gen.live/core_components.ex
+++ b/priv/templates/phx.gen.live/core_components.ex
@@ -163,20 +163,25 @@ defmodule <%= @web_namespace %>.CoreComponents do
 
   def button(assigns) do
     ~H"""
-    <button
-      type={@type}
-      class={[
-        "phx-submit-loading:opacity-75 rounded-lg bg-zinc-900 hover:bg-zinc-700 py-2 px-3",
-        "text-sm font-semibold leading-6 text-white active:text-white/80",
-        @class
-      ]}
-      {@rest}
-    >
+    <button type={@type} class={[button_classes(), @class]} {@rest}>
       {render_slot(@inner_block)}
     </button>
     """
   end
 
+  @doc """
+  Returns the default button classes.
+
+  ## Examples
+
+      <.link class={button_classes()} href={~p"/items/new"}>
+        New Item
+      </.link>
+  """
+  def button_classes do
+    "inline-block phx-submit-loading:opacity-75 rounded-lg bg-zinc-900 hover:bg-zinc-700 py-2 px-3 text-sm font-semibold leading-6 text-white active:text-white/80"
+  end
+
   @doc """
   Renders an input with label and error messages.
 
diff --git a/priv/templates/phx.gen.live/index.ex b/priv/templates/phx.gen.live/index.ex
index fd8a7d97df..8c16389d76 100644
--- a/priv/templates/phx.gen.live/index.ex
+++ b/priv/templates/phx.gen.live/index.ex
@@ -9,11 +9,9 @@ defmodule <%= inspect context.web_module %>.<%= inspect Module.concat(schema.web
     <.header>
       Listing <%= schema.human_plural %>
       <:actions>
-        <.button phx-click={JS.dispatch("click", to: {:inner, "a"})}>
-          <.link navigate={~p"<%= schema.route_prefix %>/new"}>
-            New <%= schema.human_singular %>
-          </.link>
-        </.button>
+        <.link class={button_classes()} navigate={~p"<%= schema.route_prefix %>/new"}>
+          New <%= schema.human_singular %>
+        </.link>
       </:actions>
     </.header>
 
diff --git a/priv/templates/phx.gen.live/show.ex b/priv/templates/phx.gen.live/show.ex
index 46379eb698..e5c449b0a2 100644
--- a/priv/templates/phx.gen.live/show.ex
+++ b/priv/templates/phx.gen.live/show.ex
@@ -10,11 +10,9 @@ defmodule <%= inspect context.web_module %>.<%= inspect Module.concat(schema.web
       <%= schema.human_singular %> {@<%= schema.singular %>.<%= schema.opts[:primary_key] || :id %>}
       <:subtitle>This is a <%= schema.singular %> record from your database.</:subtitle>
       <:actions>
-        <.button phx-click={JS.dispatch("click", to: {:inner, "a"})}>
-          <.link navigate={~p"<%= schema.route_prefix %>/#{@<%= schema.singular %>}/edit?return_to=show"}>
-            Edit <%= schema.singular %>
-          </.link>
-        </.button>
+        <.link class={button_classes()} navigate={~p"<%= schema.route_prefix %>/#{@<%= schema.singular %>}/edit?return_to=show"}>
+          Edit <%= schema.singular %>
+        </.link>
       </:actions>
     </.header>