diff --git a/keyserver/flow-typed/npm/frog_v0.18.x.js b/keyserver/flow-typed/npm/frog_v0.18.x.js
--- a/keyserver/flow-typed/npm/frog_v0.18.x.js
+++ b/keyserver/flow-typed/npm/frog_v0.18.x.js
@@ -38,7 +38,7 @@
     constructor(options?: FrogOptions): this;
     frame(
       route: string,
-      callback: (c: FrameContext) => FrogResponse,
+      callback: (c: FrameContext) => Promise<FrogResponse>,
     ): void;
     fetch: Fetch,
   }
diff --git a/keyserver/src/frog/frog.js b/keyserver/src/frog/frog.js
--- a/keyserver/src/frog/frog.js
+++ b/keyserver/src/frog/frog.js
@@ -8,12 +8,16 @@
 import { Button, Frog } from 'frog';
 
 import { inviteLinkURL } from 'lib/facts/links.js';
+import { ignorePromiseRejections } from 'lib/utils/promises.js';
+
+import { neynarClient } from '../utils/fc-cache.js';
+import { redisCache } from '../utils/redis-cache.js';
 
 function startFrogHonoServer() {
   const frogApp = new Frog({ title: 'frog app' });
 
-  frogApp.frame('/:inviteLink', c => {
-    const { inviteLink } = c.req.param();
+  frogApp.frame('/:inviteLink/:channelID', async c => {
+    const { inviteLink, channelID } = c.req.param();
 
     let buttonLink = 'https://comm.app';
     const inviteLinkURLPrefix = inviteLinkURL('');
@@ -22,10 +26,46 @@
       buttonLink = inviteLink;
     }
 
+    let channelInfo = await redisCache.getChannelInfo(channelID);
+    if (!channelInfo) {
+      channelInfo = await neynarClient?.fetchFarcasterChannelByID(channelID);
+
+      ignorePromiseRejections(
+        (async () => {
+          if (channelInfo) {
+            await redisCache.setChannelInfo(channelID, channelInfo);
+          }
+        })(),
+      );
+    }
+
+    let header_image_url =
+      'https://warpcast.com/~/images/DefaultChannelCoverImage.png';
+    if (channelInfo?.header_image_url) {
+      header_image_url = channelInfo.header_image_url;
+    }
+
     return c.res({
       image: (
-        <div style={{ color: 'white', display: 'flex', fontSize: 60 }}>
-          Hello World!
+        <div
+          style={{
+            position: 'relative',
+            width: '100%',
+            height: '100%',
+            display: 'flex',
+            justifyContent: 'center',
+            alignItems: 'center',
+          }}
+        >
+          <img
+            src={header_image_url}
+            alt="frame background"
+            style={{
+              width: '100%',
+              height: '100%',
+              objectFit: 'cover',
+            }}
+          />
         </div>
       ),
       intents: [
diff --git a/lib/types/farcaster-types.js b/lib/types/farcaster-types.js
--- a/lib/types/farcaster-types.js
+++ b/lib/types/farcaster-types.js
@@ -38,6 +38,7 @@
     ...
   },
   +image_url: string,
+  +header_image_url?: string,
   +description: string,
   ...
 };