diff --git a/docs/covers/README.md b/docs/covers/README.md
index 5388667..175a55d 100644
--- a/docs/covers/README.md
+++ b/docs/covers/README.md
@@ -21,8 +21,8 @@ For a skill named `<name>`:
    }
    ```
 
-   - `category`: the kind of work, in two or three words, like `Wireframes` or
-     `Go to market`.
+   - `category`: the kind of work, in two or three words and sentence case, like
+     `Wireframes` or `Go to market`.
    - `headline`: the promise, in at most two lines of about 15 characters each. Put the
      line break in yourself with `\n`.
 
diff --git a/docs/covers/app-wireframe.png b/docs/covers/app-wireframe.png
index 67925f1..a9e77ab 100644
Binary files a/docs/covers/app-wireframe.png and b/docs/covers/app-wireframe.png differ
diff --git a/docs/covers/renewal-timeline.png b/docs/covers/renewal-timeline.png
index 766eb14..a0a0564 100644
Binary files a/docs/covers/renewal-timeline.png and b/docs/covers/renewal-timeline.png differ
diff --git a/docs/covers/template.html b/docs/covers/template.html
index 6bb2fec..9f4d0b1 100644
--- a/docs/covers/template.html
+++ b/docs/covers/template.html
@@ -15,8 +15,8 @@
   }
   body { width: 1600px; height: 1000px; overflow: hidden; font-family: Monsical, monospace; color: var(--ink); background: var(--bg); position: relative; }
   .text { position: absolute; left: 80px; top: 72px; bottom: 72px; width: 720px; display: flex; flex-direction: column; }
-  .kicker { font-size: 26px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); display: flex; gap: 12px; align-items: center; }
-  .kicker .dot { width: 12px; height: 12px; border-radius: 50%; background: var(--purple); }
+  /* Like the section labels on whimsical.com: sentence case, semibold, in the brand gradient. */
+  .category { align-self: flex-start; font-family: Dinsical, sans-serif; font-size: 36px; font-weight: 600; background: linear-gradient(93deg, #11007a 2.71%, #6328c3 48.51%, #e36bff 91.53%); -webkit-background-clip: text; background-clip: text; color: transparent; }
   h1 { margin: auto 0; font-family: Dinsical, sans-serif; font-size: 108px; line-height: 0.98; white-space: pre; font-weight: 700; letter-spacing: -0.025em; }
 
   /* The browser window from the tool cards on whimsical.com, running off the right edge. */
@@ -30,7 +30,7 @@
 </head>
 <body>
   <div class="text">
-    <div class="kicker"><span class="dot"></span>Whimsical skill <span>·</span> <span data-field="category"></span></div>
+    <p class="category" data-field="category"></p>
     <h1 data-field="headline"></h1>
   </div>
   <div class="window">