Add all the required files.

src/_includes/webc/custom-peertube-link.webc

@@ -0,0 +1,16 @@
+<style>
+  custom-peertube-link {
+    display: flex;
+    align-items: flex-start;
+    gap: var(--space-xs);
+    font-size: var(--size-step-min-1);
+  }
+  custom-peertube-link svg {
+    font-size: var(--size-step-0);
+  }
+</style>
+
+<custom-svg aria-hidden="true" src="./src/assets/svg/platform/peertube.svg"></custom-svg>
+<a :href="href"><span webc:if="label" @text="label" webc:nokeep></span></a>
+
+<!-- Inspired by https://github.com/zachleat/zachleat.com  -->

src/_includes/webc/custom-peertube.webc

@@ -0,0 +1,31 @@
+<script webc:setup>
+  function getLinkUrl(instance, slug, start) {
+    return `https://${instance}/w/${slug}${start ? `?start=${start}s` : ''}`;
+  }
+  function getEmbedLinkUrl(instance, embedSlug, start) {
+    return `https://${instance}/videos/embed/${embedSlug}${start ? `?start=${start}s&` : `?`}` + `title=0&warningTitle=0`;
+  }
+</script>
+<style>
+  custom-peertube div {
+    position: relative;
+    overflow: hidden;
+    padding-top: 56.25%;
+    border-radius: 1rem;
+  }
+  custom-peertube iframe {
+    position: absolute; 
+    inset: 0px;
+    width: 100%;
+    height: 100%;
+  }
+</style>
+
+<custom-peertube webc:root class="flow">
+  <div>
+      <iframe :title="label" :src="getEmbedLinkUrl(instance,embedSlug,start)" frameborder="0" allowfullscreen="" sandbox="allow-same-origin allow-scripts allow-popups allow-forms">
+      </iframe>
+  </div>
+</custom-peertube>
+
+<custom-peertube-link @raw="label" :label="label" :href="getLinkUrl(instance,slug, start)"></custom-peertube-link>

src/assets/svg/platform/peertube.svg

@@ -0,0 +1,4 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="1em" height="1em">
+    <title>PeerTube</title>
+    <path d="M12 6.545v10.91L20.727 12M3.273 12v12L12 17.455M3.273 0v12L12 6.545" />
+</svg>