diff --git a/packages/analytics/images/banner.png b/packages/analytics/images/banner.png
new file mode 100644
index 0000000..b7917ad
Binary files /dev/null and b/packages/analytics/images/banner.png differ
diff --git a/packages/analytics/images/banner.source.html b/packages/analytics/images/banner.source.html
new file mode 100644
index 0000000..9b29751
--- /dev/null
+++ b/packages/analytics/images/banner.source.html
@@ -0,0 +1,165 @@
+<!doctype html>
+<!--
+  Source of banner.png (1280x640, rendered at 2x): the repository's social
+  preview and the launch image. Eisbachcode's design (tokens, waves and mark
+  from eisbachcode.de) with EmDash's gradient on one wave and its mark in the
+  label. The card shows analytics-page.png from this folder.
+
+  Render from this folder:
+
+    "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" \
+      --headless --disable-gpu --hide-scrollbars \
+      --force-device-scale-factor=2 --window-size=1280,640 \
+      --virtual-time-budget=8000 --allow-file-access-from-files \
+      --screenshot="$PWD/banner.png" "file://$PWD/banner.source.html"
+
+  --virtual-time-budget waits for the Satoshi webfont from Fontshare; without
+  it the text renders in a system font. The font files are not committed:
+  Satoshi's licence does not allow redistributing them.
+-->
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<link rel="preconnect" href="https://api.fontshare.com" />
+<link rel="preconnect" href="https://cdn.fontshare.com" crossorigin />
+<link href="https://api.fontshare.com/v2/css?f[]=satoshi@400,500&display=swap" rel="stylesheet" />
+<style>
+  :root {
+    --base-50:  oklch(3.5%  0.006 264);
+    --base-200: oklch(15%   0.004 150);
+    --base-300: oklch(26%   0.005 100);
+    --base-500: oklch(68%   0.008 95);
+    --base-600: oklch(78%   0.010 95);
+    --base-700: oklch(87%   0.012 100);
+    --base-900: oklch(99%   0.018 102);
+  }
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  html, body { width: 1280px; height: 640px; overflow: hidden; }
+  body {
+    background: var(--base-50);
+    color: var(--base-900);
+    font-family: "Satoshi", ui-sans-serif, system-ui, sans-serif;
+    position: relative;
+  }
+
+  .waves { position: absolute; inset: 0; pointer-events: none; }
+  .waves svg { position: absolute; inset: 0; width: 100%; height: 100%; }
+  .waves .ink { color: var(--base-900); opacity: 0.22; }
+  .waves {
+    -webkit-mask-image: radial-gradient(ellipse 34% 30% at 24% 58%, rgb(0 0 0 / 0.35) 0%, rgb(0 0 0 / 0.7) 60%, rgb(0 0 0 / 1) 100%);
+    mask-image: radial-gradient(ellipse 34% 30% at 24% 58%, rgb(0 0 0 / 0.35) 0%, rgb(0 0 0 / 0.7) 60%, rgb(0 0 0 / 1) 100%);
+  }
+
+  .frame {
+    position: relative; z-index: 2;
+    height: 100%;
+    padding: 60px 72px 52px;
+    display: flex; flex-direction: column; justify-content: space-between;
+  }
+
+  .label { display: flex; align-items: center; gap: 12px; }
+  .label svg { width: 22px; height: 22px; display: block; }
+  .label span {
+    font-size: 17px; font-weight: 400; color: var(--base-500);
+    text-transform: uppercase; letter-spacing: 0.18em;
+  }
+
+  .hero { max-width: 560px; }
+  h1 {
+    font-size: 128px; font-weight: 500;
+    letter-spacing: -0.045em; line-height: 0.9;
+    color: var(--base-900);
+  }
+  .sub {
+    margin-top: 26px;
+    font-size: 34px; font-weight: 500; letter-spacing: -0.02em; line-height: 1.15;
+    color: var(--base-600);
+  }
+
+  .card {
+    position: absolute; z-index: 1;
+    right: -24px; top: 118px;
+    width: 640px; height: 356px;
+    border-radius: 16px;
+    overflow: hidden;
+    border: 1px solid var(--base-300);
+    background: #fafafa;
+    box-shadow: 0 30px 80px rgb(0 0 0 / 0.55);
+  }
+  .card img { width: 100%; display: block; }
+
+  .foot { border-top: 1px solid var(--base-200); padding-top: 24px;
+          display: flex; align-items: center; justify-content: space-between; gap: 32px;
+          position: relative; z-index: 3; background: var(--base-50); }
+  .brand { display: flex; align-items: center; gap: 14px; }
+  .brand svg { width: 32px; height: 32px; display: block; }
+  .wordmark { font-size: 26px; font-weight: 500; letter-spacing: -0.02em; }
+  .tagline { font-size: 19px; color: var(--base-500); letter-spacing: 0.01em; }
+</style>
+</head>
+<body>
+  <div class="waves">
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 900" preserveAspectRatio="xMinYMid slice" aria-hidden="true">
+      <defs>
+        <linearGradient id="emdash-wave" x1="0" y1="0" x2="1440" y2="0" gradientUnits="userSpaceOnUse">
+          <stop offset="0" stop-color="#281A81" />
+          <stop offset="0.22" stop-color="#911475" />
+          <stop offset="0.42" stop-color="#CE2F55" />
+          <stop offset="0.6" stop-color="#FF6633" />
+          <stop offset="0.8" stop-color="#FBAD41" />
+          <stop offset="1" stop-color="#FFE9CB" />
+        </linearGradient>
+      </defs>
+      <g class="ink">
+        <path fill="none" stroke="currentColor" stroke-width="1.6" vector-effect="non-scaling-stroke"
+          d="M -40,360 C 140,320 260,420 400,400 C 540,380 660,300 800,330 C 920,356 1020,420 1160,410 C 1280,402 1380,360 1500,380" />
+        <path fill="none" stroke="currentColor" stroke-width="1.6" vector-effect="non-scaling-stroke"
+          d="M -40,140 C 120,90 260,200 420,170 C 560,144 680,60 820,90 C 940,116 1040,210 1180,200 C 1300,192 1380,140 1500,160" />
+        <path fill="none" stroke="currentColor" stroke-width="1.6" vector-effect="non-scaling-stroke"
+          d="M -40,500 C 120,460 240,560 380,540 C 520,520 640,450 780,470 C 900,490 1000,560 1140,550 C 1260,542 1360,510 1500,520" />
+        <path fill="none" stroke="currentColor" stroke-width="1.6" vector-effect="non-scaling-stroke"
+          d="M -40,640 C 130,600 250,700 390,680 C 530,660 650,590 790,610 C 910,630 1010,700 1150,690 C 1270,682 1370,650 1500,660" />
+      </g>
+      <path fill="none" stroke="url(#emdash-wave)" stroke-width="2.6" vector-effect="non-scaling-stroke" opacity="0.95"
+        d="M -40,240 C 100,210 220,300 380,270 C 520,244 640,180 780,210 C 900,236 1000,310 1140,290 C 1260,272 1360,230 1500,250" />
+    </svg>
+  </div>
+
+  <div class="card"><img src="analytics-page.png" alt="" /></div>
+
+  <div class="frame">
+    <div class="label">
+      <svg viewBox="0 0 75 75" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+        <defs>
+          <linearGradient id="fav-border" x1="-42.9996" y1="124" x2="92.4233" y2="-41.7456" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#0F006B"/><stop offset="0.0833" stop-color="#281A81"/><stop offset="0.1667" stop-color="#5D0C83"/><stop offset="0.25" stop-color="#911475"/><stop offset="0.3333" stop-color="#CE2F55"/><stop offset="0.4167" stop-color="#FF6633"/><stop offset="0.5" stop-color="#F6821F"/><stop offset="0.5833" stop-color="#FBAD41"/><stop offset="0.6667" stop-color="#FFCD89"/><stop offset="0.75" stop-color="#FFE9CB"/><stop offset="0.8333" stop-color="#FFF7EC"/><stop offset="0.9167" stop-color="#FFF8EE"/><stop offset="1" stop-color="white"/>
+          </linearGradient>
+          <linearGradient id="fav-dash" x1="91.4992" y1="27.4982" x2="28.1217" y2="54.1775" gradientUnits="userSpaceOnUse">
+            <stop stop-color="white"/><stop offset="0.1293" stop-color="#FFF8EE"/><stop offset="0.6171" stop-color="#FBAD41"/><stop offset="0.848" stop-color="#F6821F"/><stop offset="1" stop-color="#FF6633"/>
+          </linearGradient>
+        </defs>
+        <rect x="3" y="3" width="69" height="69" rx="10.518" stroke="url(#fav-border)" stroke-width="6" fill="none"/>
+        <rect x="18" y="34" width="39.3661" height="6.56101" fill="url(#fav-dash)"/>
+      </svg>
+      <span>Plugin for EmDash</span>
+    </div>
+
+    <div class="hero">
+      <h1>Analytics</h1>
+      <p class="sub">Cloudflare Web Analytics,<br />right inside EmDash.</p>
+    </div>
+
+    <div class="foot">
+      <div class="brand">
+        <svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
+          <circle cx="32" cy="32" r="24" stroke="currentColor" stroke-width="3.5" fill="none" />
+          <path d="M 13 34 C 19 22, 27 22, 32 30 C 37 38, 45 38, 51 28"
+                stroke="currentColor" stroke-width="3.5" stroke-linecap="round" fill="none" />
+        </svg>
+        <span class="wordmark">Eisbachcode</span>
+      </div>
+      <div class="tagline">Free and MIT licensed · plugins.emdashcms.com</div>
+    </div>
+  </div>
+</body>
+</html>