diff --git a/web/src/compose_closed_ui.js b/web/src/compose_closed_ui.js
index 82f09964b2..ff30a868b3 100644
--- a/web/src/compose_closed_ui.js
+++ b/web/src/compose_closed_ui.js
@@ -53,32 +53,41 @@ export function get_recipient_label(message) {
     return "";
 }
 
-function update_reply_button_state(disable = false, title) {
+function update_reply_button_state(disable = false) {
     $(".compose_reply_button").attr("disabled", disable);
-    if (!title) {
-        const title_text = $t({defaultMessage: "Reply to selected message"});
-        title = title_text + " (r)";
+    if (disable) {
+        $("#compose_buttons > .reply_button_container").attr(
+            "data-tooltip-template-id",
+            "compose_reply_button_disabled_tooltip_template",
+        );
+        return;
+    }
+    if (narrow_state.is_message_feed_visible()) {
+        $("#compose_buttons > .reply_button_container").attr(
+            "data-tooltip-template-id",
+            "compose_reply_message_button_tooltip_template",
+        );
+    } else {
+        $("#compose_buttons > .reply_button_container").attr(
+            "data-tooltip-template-id",
+            "compose_reply_selected_topic_button_tooltip_template",
+        );
     }
-    $(".compose_reply_button").prop("title", title);
 }
 
-function update_stream_button(btn_text, title) {
+function update_stream_button(btn_text) {
     $("#left_bar_compose_stream_button_big").text(btn_text);
-    $("#left_bar_compose_stream_button_big").prop("title", title);
 }
 
-function update_conversation_button(btn_text, title) {
+function update_conversation_button(btn_text) {
     $("#left_bar_compose_private_button_big").text(btn_text);
-    $("#left_bar_compose_private_button_big").prop("title", title);
 }
 
-function update_buttons(text_stream, disable_reply, title_reply) {
-    const title_stream = text_stream + " (c)";
+function update_buttons(text_stream, disable_reply) {
     const text_conversation = $t({defaultMessage: "New direct message"});
-    const title_conversation = text_conversation + " (x)";
-    update_stream_button(text_stream, title_stream);
-    update_conversation_button(text_conversation, title_conversation);
-    update_reply_button_state(disable_reply, title_reply);
+    update_stream_button(text_stream);
+    update_conversation_button(text_conversation);
+    update_reply_button_state(disable_reply);
 }
 
 export function update_buttons_for_private() {
@@ -87,25 +96,38 @@ export function update_buttons_for_private() {
         !narrow_state.pm_ids_string() ||
         people.user_can_direct_message(narrow_state.pm_ids_string())
     ) {
+        $("#left_bar_compose_stream_button_big").attr(
+            "data-tooltip-template-id",
+            "new_stream_message_button_tooltip_template",
+        );
         update_buttons(text_stream);
         return;
     }
     // disable the [Message X] button when in a private narrow
     // if the user cannot dm the current recipient
     const disable_reply = true;
-    const title_reply = $t({
-        defaultMessage: "You are not allowed to send private messages in this organization.",
-    });
-    update_buttons(text_stream, disable_reply, title_reply);
+    $("#compose_buttons > .reply_button_container").attr(
+        "data-tooltip-template-id",
+        "disable_reply_compose_reply_button_tooltip_template",
+    );
+    update_buttons(text_stream, disable_reply);
 }
 
 export function update_buttons_for_stream() {
     const text_stream = $t({defaultMessage: "New topic"});
+    $("#left_bar_compose_stream_button_big").attr(
+        "data-tooltip-template-id",
+        "new_topic_message_button_tooltip_template",
+    );
     update_buttons(text_stream);
 }
 
 export function update_buttons_for_recent_topics() {
     const text_stream = $t({defaultMessage: "New stream message"});
+    $("#left_bar_compose_stream_button_big").attr(
+        "data-tooltip-template-id",
+        "new_stream_message_button_tooltip_template",
+    );
     update_buttons(text_stream);
 }
 
diff --git a/web/src/tippyjs.js b/web/src/tippyjs.js
index 7f831a2e37..eac833a094 100644
--- a/web/src/tippyjs.js
+++ b/web/src/tippyjs.js
@@ -199,11 +199,18 @@ export function initialize() {
 
     delegate("body", {
         target: [
+            // Ideally this would be `#compose_buttons .button`, but the
+            // reply button's actual area is its containing span.
+            "#compose_buttons > .reply_button_container",
             "#left_bar_compose_mobile_button_big",
+            "#left_bar_compose_stream_button_big",
             "#left_bar_compose_private_button_big",
         ],
-        delay: LONG_HOVER_DELAY,
+        delay: EXTRA_LONG_HOVER_DELAY,
         appendTo: () => document.body,
+        onHidden(instance) {
+            instance.destroy();
+        },
     });
 
     delegate("body", {
diff --git a/web/templates/compose.hbs b/web/templates/compose.hbs
index bc37332f2a..2b1338acbd 100644
--- a/web/templates/compose.hbs
+++ b/web/templates/compose.hbs
@@ -16,12 +16,22 @@
     </div>
     <div id="compose_controls" class="new-style">
         <div id="compose_buttons">
-            <span class="new_message_button reply_button_container ">
+            <span class="new_message_button reply_button_container" data-tooltip-template-id="compose_reply_message_button_tooltip_template">
                 <button type="button" class="button small rounded compose_reply_button"
-                  id="left_bar_compose_reply_button_big"
-                  title="{{t 'Reply to selected message' }} (r)">
+                  id="left_bar_compose_reply_button_big">
                     <span class="compose_reply_button_label">{{t 'Compose message' }}</span>
                 </button>
+                <template id="compose_reply_message_button_tooltip_template">
+                    {{t 'Reply to selected message' }}
+                    {{tooltip_hotkey_hints "R"}}
+                </template>
+                <template id="compose_reply_selected_topic_button_tooltip_template">
+                    {{t 'Reply to selected conversation' }}
+                    {{tooltip_hotkey_hints "R"}}
+                </template>
+                <template id="compose_reply_button_disabled_tooltip_template">
+                    {{t 'You are not allowed to send direct messages in this organization.' }}
+                </template>
             </span>
             <span class="new_message_button mobile_button_container">
                 <button type="button" class="button small rounded compose_mobile_button"
@@ -37,9 +47,17 @@
             <span class="new_message_button stream_button_container">
                 <button type="button" class="button small rounded compose_stream_button"
                   id="left_bar_compose_stream_button_big"
-                  title="{{t 'New topic' }} (c)">
+                  data-tooltip-template-id="new_topic_message_button_tooltip_template">
                     <span class="compose_stream_button_label">{{t 'New topic' }}</span>
                 </button>
+                <template id="new_topic_message_button_tooltip_template">
+                    {{t 'New topic' }}
+                    {{tooltip_hotkey_hints "C"}}
+                </template>
+                <template id="new_stream_message_button_tooltip_template">
+                    {{t 'New stream message' }}
+                    {{tooltip_hotkey_hints "C"}}
+                </template>
             </span>
             {{#unless embedded }}
             <span class="new_message_button private_button_container">
diff --git a/web/tests/compose.test.js b/web/tests/compose.test.js
index 91e75f020f..4b41ce66a2 100644
--- a/web/tests/compose.test.js
+++ b/web/tests/compose.test.js
@@ -825,6 +825,7 @@ test_ui("DM policy disabled", ({override, override_rewire}) => {
 
 test_ui("narrow_button_titles", ({override}) => {
     override(narrow_state, "pm_ids_string", () => "31");
+    override(narrow_state, "is_message_feed_visible", () => true);
     compose_closed_ui.update_buttons_for_private();
     assert.equal(
         $("#left_bar_compose_stream_button_big").text(),