diff --git a/includes/helpers/cdn.js b/includes/helpers/cdn.js
index 9a7b9d8..8499e5f 100644
--- a/includes/helpers/cdn.js
+++ b/includes/helpers/cdn.js
@@ -49,6 +49,9 @@ module.exports = function (hexo) {
             if (_package === 'pace-js') {
                 _package = 'pace';
             }
+            if (_package === 'clipboard') {
+                _package = 'clipboard.js';
+            }
         }
         if (provider !== null && cdn_providers.hasOwnProperty(provider)) {
             provider = cdn_providers[provider];
diff --git a/includes/specs/plugins.spec.js b/includes/specs/plugins.spec.js
index e912399..27b9b5a 100644
--- a/includes/specs/plugins.spec.js
+++ b/includes/specs/plugins.spec.js
@@ -59,5 +59,10 @@ module.exports = {
         [type]: 'boolean',
         [doc]: 'Show a loading progress bar at top of the page',
         [defaultValue]: true
+    },
+    clipboard: {
+        [type]: 'boolean',
+        [doc]: 'Show the copy button in the highlighted code area',
+        [defaultValue]: true
     }
 };
\ No newline at end of file
diff --git a/layout/plugin/clipboard.ejs b/layout/plugin/clipboard.ejs
new file mode 100644
index 0000000..dc764e4
--- /dev/null
+++ b/layout/plugin/clipboard.ejs
@@ -0,0 +1,6 @@
+<% if (plugin !== false) { %>
+    <% if (!head) { %>
+    <%- _js(cdn('clipboard', '2.0.4', 'dist/clipboard.min.js'), true) %>
+    <%- _js('js/clipboard', true) %>
+    <% } %>
+<% } %>
\ No newline at end of file
diff --git a/source/css/style.styl b/source/css/style.styl
index d3e9956..7a5d14e 100644
--- a/source/css/style.styl
+++ b/source/css/style.styl
@@ -232,6 +232,9 @@ img.thumbnail
 /* ---------------------------------
  *         Custom modifiers
  * --------------------------------- */
+.is-borderless
+    border: none
+
 .is-size-7
     font-size: 0.85rem !important
 
@@ -340,6 +343,7 @@ img.thumbnail
 figure.highlight
     padding: 0
     width: 100%
+    position: relative
     margin: 1em 0 1em !important
 
     pre,
@@ -393,6 +397,16 @@ figure.highlight
         min-width: inherit
         border-radius: inherit
 
+    .copy
+        display: none
+        position: absolute
+        bottom: 0
+        right: 0
+        color: white
+        background: rgba(0, 0, 0, 0.5)
+    &:hover .copy
+        display: block
+
 /* ---------------------------------
  *        Fix Gist Snippet
  * --------------------------------- */
diff --git a/source/js/clipboard.js b/source/js/clipboard.js
new file mode 100644
index 0000000..bbf658f
--- /dev/null
+++ b/source/js/clipboard.js
@@ -0,0 +1,8 @@
+document.addEventListener('DOMContentLoaded', function () {
+    $('figure.highlight').each(function () {
+        var id = 'code-' + Date.now() + (Math.random() * 1000 | 0);
+        $(this).attr('id', id);
+        $(this).prepend($(`<button class="button is-borderless is-radiusless is-small copy" data-clipboard-target="#${id} .code" title="Copy"><i class="fas fa-copy"></i></button>`));
+    });
+    new ClipboardJS('.highlight .copy');
+});
\ No newline at end of file