diff --git a/documentation/themes/beastie/assets/js/copy-clipboard.js b/documentation/themes/beastie/assets/js/copy-clipboard.js
new file mode 100644
index 0000000000..4b11058422
--- /dev/null
+++ b/documentation/themes/beastie/assets/js/copy-clipboard.js
@@ -0,0 +1,66 @@
+/*
+BSD 2-Clause License
+
+Copyright (c) 2001-2022, The FreeBSD Documentation Project
+Copyright (c) 2021-2022, Sergio Carlavilla
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
+
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+*/
+
+(function () {
+  document.querySelectorAll(".rouge, .highlight").forEach(function(codeItem) {
+    var sourceCode = codeItem.textContent;
+
+    var icon = document.createElement("i");
+    icon.className = "fa fa-clipboard";
+
+    var tooltip = document.createElement("span");
+    tooltip.className = "tooltip";
+    tooltip.innerHTML = "Copied!";
+
+    var button = document.createElement("button");
+    button.title = "Copy to clipboard";
+    button.appendChild(icon);
+    button.appendChild(tooltip);
+
+    var clipboardWrapper = document.createElement("div");
+    clipboardWrapper.className = "copy-to-clipboard-wrapper";
+    clipboardWrapper.appendChild(button);
+
+    codeItem.appendChild(clipboardWrapper);
+
+    button.addEventListener('click', copyToClipboard.bind(button, sourceCode));
+  });
+})();
+
+function copyToClipboard(text, item) {
+  const tooltip = item.target.nextElementSibling;
+  window.navigator.clipboard.writeText(text).then(function() {
+    if (tooltip) {
+      tooltip.classList.add("show-tooltip");
+      setTimeout(function(){
+        tooltip.classList.remove("show-tooltip");
+      }, 1200);
+    }
+  });
+}
diff --git a/documentation/themes/beastie/assets/styles/global.scss b/documentation/themes/beastie/assets/styles/global.scss
index 9873fbc46e..e2172bbcf9 100644
--- a/documentation/themes/beastie/assets/styles/global.scss
+++ b/documentation/themes/beastie/assets/styles/global.scss
@@ -1,740 +1,796 @@
 /*
  * Copyright (c) 2001-2022, The FreeBSD Documentation Project
  * Copyright (c) 2021-2022, Sergio Carlavilla <carlavilla@FreeBSD.org>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
  *    documentation and/or other materials provided with the distribution.
  *
  * THIS SOFTWARE IS PROVIDED BY THE AUTHOR AND CONTRIBUTORS ``AS IS'' AND
  * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
  * ARE DISCLAIMED.  IN NO EVENT SHALL THE AUTHOR OR CONTRIBUTORS BE LIABLE
  * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
  * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS
  * OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
  * HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT
  * LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY
  * OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF
  * SUCH DAMAGE.
  *
  */
 
 html {
   font-family: 'Inter', sans-serif;
   scroll-padding-top: var(--header-height);
   scroll-behavior: auto;
 }
 
 @supports (font-variation-settings: normal) {
   html {
     font-family: 'Inter var', sans-serif;
   }
 }
 
 @supports (scrollbar-width:thin) {
   body * {
     scrollbar-width: thin;
     scrollbar-color: #D9D9D9 transparent;
   }
 }
 
 html, body {
   text-rendering: optimizeLegibility;
   line-height: calc(1ex / 0.32);
 }
 
 body {
   display: flex;
   flex-direction: column;
   color: var(--global-font-color);
   padding: 0;
   margin: 0;
   font-size: 16px;
   font-weight: 400;
   font-style: normal;
   cursor: auto;
   background-color: var(--global-background-color);
 }
 
 /* Main */
 .main-wrapper {
   display: flex;
   flex-direction: column;
   padding: 0rem 2rem 2rem 2rem;
   margin-top: var(--header-height);
   transition: padding .15s;
   background-color: var(--global-background-color);
 
   .welcome-container {
     display: flex;
     width: 100%;
     margin-top: 2.5rem;
     text-align: center;
     align-items: center;
     flex-direction: column;
 
     .title-language-container {
       display: flex;
       width: 100%;
       justify-content: center;
 
       h2 {
         margin: 0;
         border-bottom: 0px;
         margin-left: auto;
       }
 
       a {
         margin-left: auto;
 
         img {
           display: inline-flex;
           padding-right: 10px;
           align-items: center;
           justify-content: center;
           height: 1.5rem;
           width: 1.5rem;
         }
       }
     }
 
     form {
       display: flex;
       width: 100%;
       background-color: var(--global-background-color);
       justify-content: center;
 
       input {
         display: block;
         width: 50%;
         padding: 10px 20px;
         border: 1px solid #CCC;
         border-radius: 4px;
         box-shadow: inset 0 1px 3px #DDD;
         box-sizing: border-box;
         background-color: #FCFCFD;
         color: #444;
       }
     }
   }
 
   .cards-container {
     display: flex;
     flex-direction: column;
     justify-content: center;
     width: 100%;
     margin-top: 3rem;
     margin-bottom: 3rem;
 
     .row {
       display: flex;
       flex-direction: row;
       justify-content: center;
       width: 100%;
       margin-bottom: 2rem;
 
       .card {
         display: flex;
         flex: 280px 0;
         margin-left: 16px;
         padding: 24px;
         border: 1px solid var(--card-border-color);
         background-color: var(--card-background-color);
 
         a {
           display: flex;
           flex-direction: column;
           text-decoration: none;
 
           h5 {
             color: var(--global-font-color);
             font-weight: 700;
             font-size: 22px;
             margin: 0px 0px 8px 0px;
             border-bottom: 0px;
           }
 
           p {
             color: var(--global-font-color);
             font-size: 18px;
             margin: 0px;
             margin-top: auto;
             text-align: inherit;
           }
         }
       }
     }
   }
 }
 
 ul.language-list {
   display: flex;
   flex-wrap: wrap;
   list-style: none;
 
   li {
     flex: 1 0 25%;
     list-style-type: none;
     max-width: 25%;
 
     a {
       cursor: pointer;
       color: var(--global-font-color);
     }
   }
 
   .selected {
     font-weight: bolder;
   }
 }
 
 @media (max-width: 55em) {
   .main-wrapper {
     padding: 0rem 1rem 2rem 1rem;
 
     .welcome-container {
       margin-bottom: 2.5rem;
 
       form {
         input {
           width: 100%;
           background-color: var(--white);
         }
       }
 
     }
 
     .cards-container {
       display: block;
       width: 100%;
       margin: 0;
       padding: 0;
 
       .row {
         display: block;
         width: 100%;
 
         .card {
           display: block;
           width: 100%;
           margin: 0px;
           margin-bottom: 2rem;
           padding: 0px;
 
           a {
             display: flex;
             padding: 20px;
             min-height: 100px;
           }
         }
       }
     }
   }
 
 }
 
 @media (min-width: 1200px) {
   .main-wrapper {
     .cards-container {
       .row {
         .card {
           width: 33.3%;
         }
       }
     }
   }
 }
 
 @media (min-width: 768px) {
   .main-wrapper {
     .cards-container {
       .row {
         .card {
           width: 50%;
         }
       }
     }
   }
 }
 
 .abstract-title {
   font-size: 24px;
   font-weight: 700;
 }
 
 h1,
 h2,
 h3,
 h4 {
   line-height: 1.3;
 }
 
 h1,
 h2 {
   font-weight: 900;
 }
 
 h1 {
   font-size: var(--size-750);
 }
 
 h2 {
   font-size: var(--size-600);
 }
 
 h3 {
   font-size: var(--size-550);
 }
 
 h4 {
   font-size: var(--size-500);
 }
 
 h5 {
   font-size: var(--size-400);
 }
 
 h6 {
   font-size: var(--size-300);
 }
 
 h2,
 h3,
 h4,
 h5,
 h6 {
   border-bottom: 1px solid var(--lines-color);
 }
 
 h1 .anchor,
 h2 .anchor,
 h3 .anchor,
 h4 .anchor,
 h5 .anchor,
 h6 .anchor,
 h1 .link,
 h2 .link,
 h3 .link,
 h4 .link,
 h5 .link,
 h6 .link {
   text-decoration: none !important;
   color: var(--global-font-color);
 }
 
 h1 .anchor,
 h2 .anchor,
 h3 .anchor,
 h4 .anchor,
 h5 .anchor,
 h6 .anchor {
   visibility: hidden;
   font-weight: normal;
   margin-right: 5px;
 }
 
 h1 .anchor::before,
 h2 .anchor::before,
 h3 .anchor::before,
 h4 .anchor::before,
 h5 .anchor::before,
 h6 .anchor::before {
   content: "\00a7";
 }
 
 h1:hover .anchor,
 h2:hover .anchor,
 h3:hover .anchor,
 h4:hover .anchor,
 h5:hover .anchor,
 h6:hover .anchor {
   visibility: visible;
   font-weight: normal;
   margin-right: 5px;
 }
 
 hr {
   margin-top: 1rem;
   margin-bottom: 1rem;
   border: 0;
   border-top: 1px solid var(--lines-color);
 }
 
 a {
   text-decoration: none;
   color: var(--links-color);
 
   &:hover {
     text-decoration: underline;
   }
 
 }
 
 img {
   max-width: 100%;
 }
 
 .imageblock {
   .title {
     margin-top: .5rem;
     padding-bottom: 0;
     font-weight: bolder;
     font-style: italic;
   }
 }
 
 figcaption {
   font-size: var(--size-300);
   font-style: italic;
   margin-top: 1rem;
 }
 
 pre {
   border-radius: 0.25rem;
   font-family: monospace;
   background-color: var(--pre-background-color);
   font-size: 1rem;
   color: var(--pre-font-color);
   line-height: 1.4;
   margin: 0 0 24px;
   overflow: auto !important;
   padding: 1rem;
   margin: 0;
 }
 
 p {
   text-justify: inter-word;
 }
 
 b, dt, strong, th {
   font-weight: bolder;
 }
 
 dt {
   font-style: italic;
 }
 
 blockquote {
   padding-left: var(--size-600);
   border-left: 5px solid;
   font-style: italic;
 }
 
 .literalblock {
   margin: .75em 0;
   overflow: auto;
 
   .content {
     overflow: auto;
   }
 }
 
 /* callouts */
 .conum {
   display: inline-block;
   color: #FFF !important;
   background-color: #000;
   border-radius: 100px;
   text-align: center;
   font-size: .75em;
   width: 1.67em;
   height: 1.67em;
   font-style: normal;
   font-weight: bold;
 }
 
 .conum[data-value] {
   color: #FFF !important;
   text-align: center;
   font-size: .75em;
   line-height: 1.67em;
   font-style: normal;
   font-weight: bold;
 }
 
 .conum[data-value]::after {
   content: attr(data-value);
 }
 
 .colist td {
   padding-top: 4px;
   padding-bottom: 4px;
 }
 
 .colist tr td b, .programlisting b {
   display: none;
 }
 
 .rouge b {
   display: none;
 }
 
 /* Tables */
 table {
   caption {
     text-rendering: optimizeLegibility;
     text-align: left;
     font-weight: bolder;
     font-size: 1rem;
   }
 }
 
 table.tableblock {
   display: block;
   margin: auto;
   margin-bottom: 1.25em;
   max-width: 100%;
   border-collapse: collapse;
   overflow-x: auto;
 
   th {
     text-align: left;
     background-color: var(--table-header-background-color);
     color: var(--table-header-font-color);
     text-rendering: optimizeLegibility;
     padding: .5em .625em .625em;
     border: 0 solid #DEDEDE;
     border-width: 0 1px 1px 0;
   }
 
   td {
     text-align: left;
     border: 0 solid #DEDEDE;
     text-rendering: optimizeLegibility;
     line-height: 1.6;
     padding: .5em .625em .625em;
     font-size: inherit;
     border-width: 0 1px 1px 0;
   }
 
   td.icon {
     border: none;
   }
 
   td:first-of-type, th:first-of-type {
     border-left: none;
   }
 
   td:last-of-type, th:last-of-type {
     border-right: none;
   }
 }
 
 table.stretch {
   width: 100%;
 }
 
 /* Admonitions */
 .admonitionblock {
   margin: 1.4rem 0;
   padding: 1rem;
   color: var(--admonition-font-color);
 
   table {
     table-layout: fixed;
     position: relative;
     width: 100%;
 
     tbody {
       tr {
         td.icon {
           position: absolute;
           top: 0;
           left: 0;
           line-height: 1;
           padding-bottom: .5rem;
 
           i {
             display: inline-flex;
             align-items: center;
             width: auto;
             background-position-x: .5em;
             vertical-align: initial;
             font-style: normal;
 
             &:after {
               content: attr(title);
               font-weight: bolder;
               padding: 0 .5em;
               margin: -.05em;
             }
           }
 
           .icon-note::before {
             content:"\f05a";
             color: var(--admonition-note-color);
           }
 
           .icon-tip::before {
             content:"\f0eb";
             color: var(--admonition-tip-color)
           }
 
           .icon-warning::before {
             content:"\f071";
             color: var(--admonition-warning-color);
           }
 
           .icon-caution::before {
             content:"\f06d";
             color: var(--admonition-caution-color);
           }
 
           .icon-important::before {
             content:"\f06a";
             color: var(--admonition-important-color);
           }
         }
 
         td.icon [class^="fa icon-"] {
           font-size: 1.2rem;
           cursor: default;
         }
 
         td.content {
           width: 100%;
           word-wrap: anywhere;
 
           .title {
             margin-top: 2rem;
           }
 
           .paragraph {
             padding-top: .5rem;
           }
 
           a {
             color: var(--admonition-links-color);
           }
         }
       }
     }
   }
 }
 
 .note {
   border-left: 5px solid var(--admonition-note-color);
   background-color: var(--admonition-note-background-color);
 }
 
 .warning {
   border-left: 5px solid var(--admonition-warning-color);
   background-color: var(--admonition-warning-background-color);
 }
 
 .important {
   border-left: 5px solid var(--admonition-important-color);
   background-color: var(--admonition-important-background-color);
 }
 
 .caution {
   border-left: 5px solid var(--admonition-caution-color);
   background-color: var(--admonition-caution-background-color);
 }
 
 .tip {
   border-left: 5px solid var(--admonition-tip-color);
   background-color: var(--admonition-tip-background-color);
 }
 
 /* Example */
 .example, .exampleblock {
   border-left: 5px solid var(--example-block-color);
   padding: 1rem;
   background-color: var(--example-block-background-color);
 }
 
 .exampleblock {
   margin: .75rem 0;
   color: var(--example-block-font-color);
 
   .title {
     font-weight: bolder;
   }
 
   .content {
     .literalblock {
       .content{
         background: #fefde6 !important;
         border: none !important;
         color: var(--global-font-color);
       }
     }
 
     a {
       color: var(--admonition-links-color);
     }
   }
 }
 
 .procedure {
   border-left: 5px solid #B3B3B3;
   padding: 1rem;
   margin-bottom: 1.4rem;
 }
 
 /* Misc */
 .fa {
     font-family: FontAwesome;
     font-style: normal;
 }
 
 .listingblock {
   margin: .75em 0;
+  position: relative;
+}
+
+.highlight {
+  padding-top: 1.5rem;
+  padding-bottom: 1.5rem;
 }
 
 code {
   font-family: "DejaVu Sans Mono", monospace;
   font-size: 0.75rem;
 }
 
 .filename {
   font-weight: bolder;
 }
 
 details {
   summary {
     cursor: pointer;
   }
 }
 
 kbd {
   font-family: "DejaVu Sans", "DejaVu Sans Bold";
   display: inline-block;
   color: rgba(0,0,0,.8);
   font-size: .65em;
   line-height: 1.45;
   background-color: #F7F7F7;
   border: 1px solid #ccc;
   border-radius: 3px;
   box-shadow: 0 1px 0 rgba(0,0,0,.2),0 0 0 .1em #FFF inset;
   margin: 0 .15em;
   padding: .2em .5em;
   vertical-align: middle;
   position: relative;
   top: -.1em;
   white-space: nowrap;
 }
 
 .to-top {
   opacity: 1;
   visibility: visible;
   transition: .2s;
   position: fixed;
   bottom: 1.2rem;
   right: 1.5rem;
   z-index: 15;
   text-decoration: none;
 
   i {
     font-size: 2rem;
     color: var(--global-font-color);
   }
 }
+
+.copy-to-clipboard-wrapper {
+  position: absolute;
+  margin: 0;
+  padding: .50rem;
+  right: .5rem;
+  top: 0rem;
+
+  button {
+    display: flex;
+    flex-direction: column;
+    border: none;
+    cursor: pointer;
+    align-items: center;
+    width: 1rem;
+    height: 1rem;
+    background: none;
+
+    &:focus {
+      outline: none;
+    }
+
+    i {
+      color: var(--white);
+    }
+  }
+
+  .tooltip {
+    visibility: hidden;
+    opacity: 0;
+    justify-content: center;
+    margin-top: 1em;
+    background-color: var(--copy-clipboard-tooltip-background-color);
+    border-radius: .25em;
+    padding: .5em;
+    color: var(--white);
+    z-index: 999;
+
+    &:focus {
+      outline: none;
+    }
+  }
+
+  .show-tooltip {
+    visibility: visible;
+    opacity: 1;
+    transition: visibility 0s easy 0s;
+  }
+
+}
diff --git a/documentation/themes/beastie/assets/styles/variables.scss b/documentation/themes/beastie/assets/styles/variables.scss
index adb22109e1..48a87f7c14 100644
--- a/documentation/themes/beastie/assets/styles/variables.scss
+++ b/documentation/themes/beastie/assets/styles/variables.scss
@@ -1,149 +1,152 @@
 /*
  * Copyright (c) 2001-2022, The FreeBSD Documentation Project
  * Copyright (c) 2021-2022, Sergio Carlavilla <carlavilla@FreeBSD.org>
  * All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  * 1. Redistributions of source code must retain the above copyright
  *    notice, this list of conditions and the following disclaimer.
  * 2. Redistributions in binary form must reproduce the above copyright
  *    notice, this list of conditions and the following disclaimer in the
  *    documentation and/or other materials provided with the distribution.
  *
  * THIS SOFTWARE IS PROVIDED BY THE AUTHOR AND CONTRIBUTORS ``AS IS'' AND
  * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
  * ARE DISCLAIMED.  IN NO EVENT SHALL THE AUTHOR OR CONTRIBUTORS BE LIABLE
  * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
  * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS
  * OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
  * HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT
  * LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY
  * OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF
  * SUCH DAMAGE.
  *
  */
 
 :root {
   --header-height: 4.5rem;
   --documentation-padding: 0px 20px 20px 20px;
   --size-200: 0.50rem;
   --size-300: 0.75rem;
   --size-400: 1rem;
   --size-500: 1.33rem;
   --size-550: 1.55rem;
   --size-600: 1.77rem;
   --size-700: 2.30rem;
   --size-750: 2.40rem;
   --size-800: 3.15rem;
   --size-900: 4.2rem;
 
   --flow-space: var(--size-700);
 }
 
 .theme-light {
   --white: #FFF;
   --black: #000;
   --global-font-color: #444;
   --header-background: #9F0E0F;
   --header-font-color: #FFF;
   --global-background-color: #FCFCFD;
   --card-background-color: #F0F1F5;
   --card-border-color: #F0F1F5;
   --table-header-background-color: #F1F3F1;
   --table-header-font-color: #444;
   --footer-background: #F0F1F5;
   --footer-border-color: #F0F1F5;
   --lines-color: #E6ECF1;
   --links-color: #0645AD;
   --pre-background-color: #F4F4F4;
   --pre-font-color: #444;
+  --copy-clipboard-tooltip-background-color: #43453B;
 
   --admonition-font-color: #444;
   --admonition-links-color: #0645AD;
   --admonition-note-color: #19407C;
   --admonition-note-background-color: #EAF1FB;
   --admonition-warning-color: #BF6900;
   --admonition-warning-background-color: #FFF4E6;
   --admonition-important-color: #BF0000;
   --admonition-important-background-color: #FFE6E6;
   --admonition-caution-color: #BF3400;
   --admonition-caution-background-color: #FFECE6;
   --admonition-tip-color: #43B929;
   --admonition-tip-background-color: #EDFAEA;
   --example-block-color: #F1BB16;
   --example-block-background-color: #FEF8E7;
   --example-block-font-color: #444;
 }
 
 .theme-dark {
   --white: #FFF;
   --black: #000;
   --global-font-color: #EEEFF1;
   --header-background: #9F0E0F;
   --header-font-color: #EEEFF1;
   --global-background-color: #333333;
   --card-background-color: #272727;
   --card-border-color: #272727;
   --table-header-background-color: #F1F3F1;
   --table-header-font-color: #444;
   --footer-background: #2B2B2B;
   --footer-border-color: #2B2B2B;
   --lines-color: #4d4d4d;
   --links-color: #BAD7FF;
   --pre-background-color: #272727;
   --pre-font-color: #EEEFF1;
+  --copy-clipboard-tooltip-background-color: #43453B;
 
   --admonition-font-color: #444;
   --admonition-links-color: #1A79FF;
   --admonition-note-color: #19407C;
   --admonition-note-background-color: #EAF1FB;
   --admonition-warning-color: #BF6900;
   --admonition-warning-background-color: #FFF4E6;
   --admonition-important-color: #BF0000;
   --admonition-important-background-color: #FFE6E6;
   --admonition-caution-color: #BF3400;
   --admonition-caution-background-color: #FFECE6;
   --admonition-tip-color: #43B929;
   --admonition-tip-background-color: #EDFAEA;
   --example-block-color: #F1BB16;
   --example-block-background-color: #FEF8E7;
   --example-block-font-color: #272727;
 }
 
 .theme-high-contrast {
   --white: #FFF;
   --black: #000;
   --global-font-color: #FFF;
   --header-background: #9F0E0F;
   --header-font-color: #FFF;
   --global-background-color: #000;
   --card-background-color: #000;
   --card-border-color: #FFF;
   --table-header-background-color: #FFF;
   --table-header-font-color: #000;
   --footer-background: #000;
   --footer-border-color: #FFF;
   --lines-color: #FFF;
   --links-color: #9F0E0F;
   --pre-background-color: #FFF;
   --pre-font-color: #000;
+  --copy-clipboard-tooltip-background-color: #43453B;
 
   --admonition-font-color: #000;
   --admonition-note-color: #19407C;
   --admonition-links-color: #9F0E0F;
   --admonition-note-background-color: #EAF1FB;
   --admonition-warning-color: #BF6900;
   --admonition-warning-background-color: #FFF4E6;
   --admonition-important-color: #BF0000;
   --admonition-important-background-color: #FFE6E6;
   --admonition-caution-color: #BF3400;
   --admonition-caution-background-color: #FFECE6;
   --admonition-tip-color: #43B929;
   --admonition-tip-background-color: #EDFAEA;
   --example-block-color: #F1BB16;
   --example-block-background-color: #FEF8E7;
   --example-block-font-color: #000;
 }
diff --git a/documentation/themes/beastie/layouts/partials/site-head.html b/documentation/themes/beastie/layouts/partials/site-head.html
index 781ad79c12..e20572e820 100644
--- a/documentation/themes/beastie/layouts/partials/site-head.html
+++ b/documentation/themes/beastie/layouts/partials/site-head.html
@@ -1,62 +1,68 @@
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="description" content="{{ if .IsHome }}{{ .Site.Params.description }}{{ else }}{{ .Description }}{{ end }}"/>
   <meta name="keywords" content="{{ with .Site.Params.tags -}}{{ delimit . ", " }}{{- end }}" />
   <meta name="copyright" content="1995-2021 The FreeBSD Foundation">
   <link rel="canonical" href="{{ .Permalink }}" />
 
   <title>{{ with .Params.Title }}{{ . }} | {{ end }} {{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
 
   <meta name="theme-color" content="#790000">
   <meta name="color-scheme" content="light dark high-contrast">
 
   {{ if $.Site.Params.isOnline }}
     <link rel="shortcut icon" href="{{ absLangURL ($.Site.BaseURL) }}favicon.ico">
 
     {{- $styles := resources.Get "styles/main.scss" | resources.ToCSS | resources.Minify }}
     <link rel="stylesheet" href="{{ $styles.Permalink }}">
     <link rel="stylesheet" href="{{ absLangURL ($.Site.BaseURL) }}css/font-awesome-min.css">
 
     {{- $themeChooser := resources.Get "js/theme-chooser.js" | resources.Minify }}
     <script defer src="{{ $themeChooser.RelPermalink }}"></script>
+
+    {{- $copyClipboard := resources.Get "js/copy-clipboard.js" | resources.Minify }}
+    <script defer src="{{ $copyClipboard.RelPermalink }}"></script>
   {{ else }}
     <link rel="shortcut icon" href="/favicon.ico">
 
     {{- $styles := resources.Get "styles/main.scss" | resources.ToCSS | resources.Minify }}
     <link rel="stylesheet" href="{{ $styles.RelPermalink }}">
     <link rel="stylesheet" href="/css/font-awesome-min.css">
 
     {{- $themeChooser := resources.Get "js/theme-chooser.js" | resources.Minify }}
     <script defer src="{{ $themeChooser.RelPermalink }}"></script>
+
+    {{- $copyClipboard := resources.Get "js/copy-clipboard.js" | resources.Minify }}
+    <script defer src="{{ $copyClipboard.RelPermalink }}"></script>
   {{ end }}
 
   <!-- SEO -->
   {{ if $.Site.Params.isOnline }}
     <meta name="twitter:card" content="summary"/>
     <meta name="twitter:domain" content="docs.FreeBSD.org"/>
     <meta name="twitter:site" content="@freebsd"/>
     <meta name="twitter:url" content="https://twitter.com/freebsd"/>
     <meta property="og:title" content="{{ if .IsHome }}{{ .Site.Params.Title }}{{ else }}{{ .Title }}{{ end }}" />
     <meta property="og:description" content="{{ if .IsHome }}{{ .Site.Params.description }}{{ else }}{{ .Description }}{{ end }}" />
     <meta property="og:type" content="website"/>
     <meta property="og:image" content="{{ absLangURL ($.Site.BaseURL) }}favicon.ico"/>
     <meta property="og:image:alt" content="FreeBSD Logo">
     <meta property="og:locale" content="{{ $.Site.Language.Lang | default "en" }}" />
     <meta property="og:url" content="{{ .Permalink }}" />
     <meta property="og:site_name" content="{{ .Site.Title }}" />
     <script type="application/ld+json">
       {
         "@context": "http://schema.org",
         "@type": "Article",
         "url": "{{ .Permalink }}",
         "name": "{{ .Site.Title }}",
         "headline": "{{ .Site.Title }}",
         "description": "{{ .Site.Params.description }}"
       }
     </script>
     <!-- END SEO -->
 
   {{ end }}
 </head>