diff --git a/frontend/src/components/ChannelPage.tsx b/frontend/src/components/ChannelPage.tsx
index 25906c7..4488d5b 100644
--- a/frontend/src/components/ChannelPage.tsx
+++ b/frontend/src/components/ChannelPage.tsx
@@ -133,13 +133,14 @@ export default function ChannelPage({
       {/* Banner + back */}
       <div className="relative">
         {ch?.banner_url ? (
-          // Keep the banner's real aspect ratio (object-contain, capped height); letterbox with
-          // the surface colour rather than stretching/cropping it to fill.
-          <div className="w-full flex justify-center bg-surface">
+          // Match YouTube's banner: the stored bannerExternalUrl is the full 16:9 template at a
+          // low default size, so request a crisp wide version (=w1707) and object-cover the
+          // desktop "safe area" — the centre 2560×423 (~6:1) band — at full width.
+          <div className="w-full overflow-hidden bg-surface" style={{ aspectRatio: "2560 / 423" }}>
             <img
-              src={ch.banner_url}
+              src={`${ch.banner_url}=w1707`}
               alt=""
-              className="block max-h-40 w-auto max-w-full object-contain"
+              className="w-full h-full object-cover object-center"
             />
           </div>
         ) : (