diff --git a/integtest/spec/helper/console_alternative_examples.rb b/integtest/spec/helper/console_alternative_examples.rb
index 80435957a901c..8048eabafaab6 100644
--- a/integtest/spec/helper/console_alternative_examples.rb
+++ b/integtest/spec/helper/console_alternative_examples.rb
@@ -47,6 +47,7 @@ module ConsoleExamples
     it 'contains the js listing followed by the csharp listing' do
       expect(body).to include(<<~HTML.strip)
         <div class="pre_wrapper lang-js alternative">
+        <div class="console_code_copy" title="Copy to clipboard"></div>
         <pre class="programlisting prettyprint lang-js alternative">const result = await client.search({
           body: { query: 'foo bar' } <a id="A0-CO1-1"></a><i class="conum" data-value="1"></i>
         })</pre>
@@ -57,6 +58,7 @@ module ConsoleExamples
     it 'contains the csharp listing followed by the default listing' do
       expect(body).to include(<<~HTML.strip)
         <div class="pre_wrapper lang-csharp alternative">
+        <div class="console_code_copy" title="Copy to clipboard"></div>
         <pre class="programlisting prettyprint lang-csharp alternative">var searchResponse = _client.Search&lt;Project&gt;(s =&gt; s
             .Query(q =&gt; q
                 .QueryString(m =&gt; m
@@ -72,6 +74,7 @@ module ConsoleExamples
     it 'contains the default listing followed by the console widget' do
       expect(body).to include(<<~HTML.strip)
         <div class="pre_wrapper lang-console default #{has_classes}">
+        <div class="console_code_copy" title="Copy to clipboard"></div>
         <pre class="programlisting prettyprint lang-console default #{has_classes}">GET /_search
         {
             "query": "foo bar" <a id="CO1-1"></a><i class="conum" data-value="1"></i>
diff --git a/resources/asciidoctor/lib/docbook_compat/convert_listing.rb b/resources/asciidoctor/lib/docbook_compat/convert_listing.rb
index 9f10d9d909e83..3be679bc25d44 100644
--- a/resources/asciidoctor/lib/docbook_compat/convert_listing.rb
+++ b/resources/asciidoctor/lib/docbook_compat/convert_listing.rb
@@ -52,6 +52,7 @@ def convert_listing_body_with_language(node, lang)
       pre_classes = "programlisting prettyprint lang-#{lang}#{extra_classes}"
       [
         %(<div class="pre_wrapper lang-#{lang}#{extra_classes}">),
+        %(<div class="console_code_copy" title="Copy to clipboard"></div>),
         %(<pre class="#{pre_classes}">#{node.content || ''}</pre>),
         %(</div>),
       ].join "\n"
diff --git a/resources/asciidoctor/spec/docbook_compat_spec.rb b/resources/asciidoctor/spec/docbook_compat_spec.rb
index 085bdf30dcb8c..4d8650c6f276d 100644
--- a/resources/asciidoctor/spec/docbook_compat_spec.rb
+++ b/resources/asciidoctor/spec/docbook_compat_spec.rb
@@ -1065,6 +1065,7 @@
       # It is important that there isn't any extra space around the <pre> tags
       expect(converted).to include(<<~HTML)
         <div class="pre_wrapper lang-sh">
+        <div class="console_code_copy" title="Copy to clipboard"></div>
         <pre class="programlisting prettyprint lang-sh">cpanm Search::Elasticsearch</pre>
         </div>
       HTML
@@ -1253,6 +1254,7 @@
       it 'the role is included as a class' do
         expect(converted).to include(<<~HTML)
           <div class="pre_wrapper lang-sh foo">
+          <div class="console_code_copy" title="Copy to clipboard"></div>
           <pre class="programlisting prettyprint lang-sh foo">cpanm Search::Elasticsearch</pre>
           </div>
         HTML
diff --git a/resources/web/docs_js/index.js b/resources/web/docs_js/index.js
index 9c57bee4ef798..6dbed75d3fa3c 100644
--- a/resources/web/docs_js/index.js
+++ b/resources/web/docs_js/index.js
@@ -437,6 +437,19 @@ $(function() {
     });
   });
 
+  $('div.console_code_copy').each(function () {
+    const $copyButton = $(this);
+    const langText = $copyButton.next().text();
+
+    $copyButton.on('click', function () {
+      utils.copyText(langText, lang_strings);
+      $copyButton.addClass('copied');
+      setTimeout(function () {
+        $copyButton.removeClass('copied')
+      }, 3000);
+    });
+  });
+
   var div = $('div.toc');
 
   // Fetch toc.html unless there is already a .toc on the page
diff --git a/resources/web/style/console_widget.pcss b/resources/web/style/console_widget.pcss
index 5a135849b599a..5b8a5fdf532b5 100644
--- a/resources/web/style/console_widget.pcss
+++ b/resources/web/style/console_widget.pcss
@@ -34,4 +34,30 @@
       cursor: pointer;
     }
   }
+  .console_code_copy {
+    background-image: inline("img/copy.svg");
+    display: inline-block;
+    width: 16px;
+    height: 16px;
+    min-width: 16px;
+    min-height: 16px;
+    vertical-align: text-bottom;
+    align-self: center;
+    &:hover {
+      text-decoration: none !important;
+      cursor: pointer;
+    }
+    filter: invert(1);
+    position: absolute;
+    top: 25px;
+    right: 20px;
+    opacity: 0.7;
+  }
+
+  .console_code_copy:hover {
+    opacity: 1;
+  }
+  .console_code_copy.copied {
+    background-image: inline("img/check.svg");
+  }
 }
diff --git a/resources/web/style/img/check.svg b/resources/web/style/img/check.svg
new file mode 100644
index 0000000000000..c73382e30b2c8
--- /dev/null
+++ b/resources/web/style/img/check.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="euiIcon eui-alignMiddle css-61rd3k-euiIcon-m-isLoaded" role="img" data-icon-type="check" data-is-loaded="true" aria-hidden="true"><path fill-rule="evenodd" d="M6.5 12a.502.502 0 0 1-.354-.146l-4-4a.502.502 0 0 1 .708-.708L6.5 10.793l6.646-6.647a.502.502 0 0 1 .708.708l-7 7A.502.502 0 0 1 6.5 12"></path></svg>
diff --git a/resources/web/style/img/copy.svg b/resources/web/style/img/copy.svg
new file mode 100644
index 0000000000000..3588cfcf35145
--- /dev/null
+++ b/resources/web/style/img/copy.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="euiIcon euiButtonIcon__icon docsmobile-1jhl3f9-euiIcon-m-inherit" role="img" aria-hidden="true" style=" color: white;"><path d="M2 2.729V2a1 1 0 0 1 1-1h2v1H3v12h4v1H3a1 1 0 0 1-1-1V2.729zM14 5V2a1 1 0 0 0-1-1h-2v1h2v3h1zm-1 1h2v9H8V6h5V5H8a1 1 0 0 0-1 1v9a1 1 0 0 0 1 1h7a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1h-2v1z"></path><path d="M9 10h5V9H9v1zm0-2h5V7H9v1zm0 4h5v-1H9v1zm0 2h5v-1H9v1zm2-12V1a1 1 0 0 0-1-1H6a1 1 0 0 0-1 1v1h1V1h4v1h1zM5 3h6V2H5v1z"></path></svg>