diff --git a/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/GenerateMarkdownAndStorybookExamples.java b/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/GenerateMarkdownAndStorybookExamples.java
index 8deb7e78..2699d945 100644
--- a/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/GenerateMarkdownAndStorybookExamples.java
+++ b/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/GenerateMarkdownAndStorybookExamples.java
@@ -72,12 +72,16 @@ public class GenerateMarkdownAndStorybookExamples {
 
     @Test
     void generateAlertComponent() {
-        new MarkdownDocumentationExamplesGenerator(AlertExamplesPanel.class, UtrechtAlert.class, "alert").generate();
+        new MarkdownDocumentationExamplesGenerator(
+            AlertExamplesPanel.class,
+            UtrechtAlert.class,
+            "alert",
+            "Alert"
+        ).generate();
     }
 
     @Test
     void generateBadgeListComponent() {
-
         tester.startComponentInPage(BadgeListExamplesPanel.class);
         String renderedHtml = tester.getLastResponseAsString();
 
@@ -85,13 +89,19 @@ void generateBadgeListComponent() {
             BadgeListExamplesPanel.class,
             UtrechtBadgeListBorder.class,
             "badge-list",
+            "Badge List",
             renderedHtml
         ).generate();
     }
 
     @Test
     void generateBodyComponent() {
-        new MarkdownDocumentationExamplesGenerator(BodyExamplesPanel.class, BodyExamplesPanel.class, "body").generate();
+        new MarkdownDocumentationExamplesGenerator(
+            BodyExamplesPanel.class,
+            BodyExamplesPanel.class,
+            "body",
+            "Body"
+        ).generate();
     }
 
     @Test
@@ -99,7 +109,9 @@ void generateButtonGroupComponent() {
         new MarkdownDocumentationExamplesGenerator(
             ButtonGroupExamplesPanel.class,
             UtrechtButtonGroupBorder.class,
-            "button-group").generate();
+            "button-group",
+            "Button Group"
+        ).generate();
     }
 
     @Test
@@ -107,7 +119,8 @@ void generateCodeBlockComponent() {
         new MarkdownDocumentationExamplesGenerator(
             CodeBlockExamplesPanel.class,
             UtrechtCodeBlock.class,
-            "code-block"
+            "code-block",
+            "Code Block"
         ).generate();
     }
 
@@ -116,7 +129,8 @@ void generateColumnLayoutComponent() {
         new MarkdownDocumentationExamplesGenerator(
             ColumnLayoutExamplesPanel.class,
             UtrechtColumnLayoutBorder.class,
-            "column-layout"
+            "column-layout",
+            "Column Layout"
         ).generate();
     }
 
@@ -125,7 +139,8 @@ void generateFormFieldCheckboxComponent() {
         new MarkdownDocumentationExamplesGenerator(
             FormFieldCheckboxExamplesPanel.class,
             UtrechtFormFieldCheckbox.class,
-            "form-field-checkbox"
+            "form-field-checkbox",
+            "Form Field Checkbox"
         ).generate();
     }
 
@@ -134,13 +149,13 @@ void generateFormFieldLabelComponent() {
         new MarkdownDocumentationExamplesGenerator(
             FormFieldLabelExamplesPanel.class,
             UtrechtFormLabel.class,
-            "form-field-label"
+            "form-field-label",
+            "Form Field Label"
         ).generate();
     }
 
     @Test
     void generateHeadingComponent() {
-
         tester.startComponentInPage(HeadingExamplesPanel.class);
         String renderedHtml = tester.getLastResponseAsString();
 
@@ -148,6 +163,7 @@ void generateHeadingComponent() {
             HeadingExamplesPanel.class,
             UtrechtHeading.class,
             "heading",
+            "Heading",
             renderedHtml
         ).generate();
     }
@@ -157,7 +173,9 @@ void generateHeadingGroupComponent() {
         new MarkdownDocumentationExamplesGenerator(
             HeadingGroupExamplesPanel.class,
             UtrechtHeadingGroupBorder.class,
-            "heading-group").generate();
+            "heading-group",
+            "Heading Group"
+        ).generate();
     }
 
     @Test
@@ -165,7 +183,9 @@ void generateHtmlContentComponent() {
         new MarkdownDocumentationExamplesGenerator(
             HtmlContentExamplesPanel.class,
             UtrechtHtmlContentBorder.class,
-            "html-content").generate();
+            "html-content",
+            "HTML Content"
+        ).generate();
     }
 
     @Test
@@ -173,7 +193,9 @@ void generateRotterdamLogoImage() {
         new MarkdownDocumentationExamplesGenerator(
             RotterdamLogoImageExamplesPanel.class,
             RotterdamLogoImage.class,
-            "rotterdam-logo-image").generate();
+            "rotterdam-logo-image",
+            "Rotterdam Logo Image"
+        ).generate();
     }
 
     @Test
@@ -181,7 +203,9 @@ void generateUtrechtLogo() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtLogoExamplesPanel.class,
             UtrechtLogoBorder.class,
-            "utrecht-logo").generate();
+            "utrecht-logo",
+            "Logo"
+        ).generate();
     }
 
     @Test
@@ -189,7 +213,9 @@ void generateUtrechtIcon() {
         new MarkdownDocumentationExamplesGenerator(
             IconExamplesPanel.class,
             UtrechtIconBorder.class,
-            "utrecht-icon").generate();
+            "utrecht-icon",
+            "Icon"
+        ).generate();
     }
 
     @Test
@@ -197,7 +223,9 @@ void generateUtrechtNumberBadge() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtNumberBadgeExamplesPanel.class,
             UtrechtNumberBadge.class,
-            "utrecht-number-badge").generate();
+            "utrecht-number-badge",
+            "Number Badge"
+        ).generate();
     }
 
     @Test
@@ -205,7 +233,9 @@ void generateUtrechtPageBody() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtPageBodyExamplesPanel.class,
             UtrechtPageBodyBorder.class,
-            "utrecht-page-body").generate();
+            "utrecht-page-body",
+            "Page Body"
+        ).generate();
     }
 
     @Test
@@ -213,7 +243,9 @@ void generateUtrechtPageFooter() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtPageFooterExamplesPanel.class,
             UtrechtPageFooterBorder.class,
-            "utrecht-page-footer").generate();
+            "utrecht-page-footer",
+            "Page Footer"
+        ).generate();
     }
 
     @Test
@@ -221,7 +253,9 @@ void generateUtrechtPageLayout() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtPageLayoutExamplesPanel.class,
             UtrechtPageLayoutBorder.class,
-            "utrecht-page-layout").generate();
+            "utrecht-page-layout",
+            "Page Layout"
+        ).generate();
     }
 
     @Test
@@ -229,7 +263,9 @@ void generateUtrechtPreserveData() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtPreserveDataExamplesPanel.class,
             UtrechtPreserveDataLabel.class,
-            "utrecht-preserve-data").generate();
+            "utrecht-preserve-data",
+            "Preserve Data"
+        ).generate();
     }
 
     @Test
@@ -237,7 +273,9 @@ void generateUtrechtRoot() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtRootExamplesPanel.class,
             UtrechtRootBorder.class,
-            "utrecht-root").generate();
+            "utrecht-root",
+            "Root"
+        ).generate();
     }
 
     @Test
@@ -245,7 +283,9 @@ void generateUtrechtSeparator() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtSeparatorExamplesPanel.class,
             UtrechtSeparator.class,
-            "utrecht-separator").generate();
+            "utrecht-separator",
+            "Separator"
+        ).generate();
     }
 
     @Test
@@ -253,7 +293,9 @@ void generateUtrechtOrderedList() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtOrderedListExamplesPanel.class,
             UtrechtOrderedList.class,
-            "utrecht-ordered-list").generate();
+            "utrecht-ordered-list",
+            "Ordered List"
+        ).generate();
     }
 
     @Test
@@ -261,7 +303,9 @@ void generateUtrechtUnorderedList() {
         new MarkdownDocumentationExamplesGenerator(
             UtrechtUnorderedListExamplesPanel.class,
             UtrechtUnorderedList.class,
-            "utrecht-unordered-list").generate();
+            "utrecht-unordered-list",
+            "Unordered List"
+        ).generate();
     }
 
     @AfterEach
diff --git a/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/MarkdownDocumentationExamplesGenerator.java b/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/MarkdownDocumentationExamplesGenerator.java
index 7998280e..1345660b 100644
--- a/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/MarkdownDocumentationExamplesGenerator.java
+++ b/wicket/docs-wicket/src/test/java/nl/rotterdam/wicket/nl_design/docs/storybook_generator/MarkdownDocumentationExamplesGenerator.java
@@ -1,15 +1,11 @@
 package nl.rotterdam.wicket.nl_design.docs.storybook_generator;
 
+import static nl.rotterdam.wicket.nl_design.docs.ModuleRootResolver.resolveModuleRootPath;
+
 import com.github.javaparser.JavaParser;
 import com.github.javaparser.ast.CompilationUnit;
 import com.github.javaparser.ast.body.MethodDeclaration;
 import com.vladsch.flexmark.html2md.converter.FlexmarkHtmlConverter;
-import nl.rotterdam.wicket.docs.ComponentExample;
-import org.apache.wicket.Component;
-import org.apache.wicket.markup.html.panel.Panel;
-import org.apache.wicket.util.string.Strings;
-import org.junit.platform.commons.support.ModifierSupport;
-
 import java.io.File;
 import java.io.IOException;
 import java.lang.reflect.Method;
@@ -18,8 +14,11 @@
 import java.util.Comparator;
 import java.util.List;
 import java.util.stream.IntStream;
-
-import static nl.rotterdam.wicket.nl_design.docs.ModuleRootResolver.resolveModuleRootPath;
+import nl.rotterdam.wicket.docs.ComponentExample;
+import org.apache.wicket.Component;
+import org.apache.wicket.markup.html.panel.Panel;
+import org.apache.wicket.util.string.Strings;
+import org.junit.platform.commons.support.ModifierSupport;
 
 public class MarkdownDocumentationExamplesGenerator {
 
@@ -28,6 +27,7 @@ public class MarkdownDocumentationExamplesGenerator {
     private final File markdownStorybookFile;
     private final Panel headingPanel;
     private final String componentName;
+    private final String componentTitle;
     private final String componentNameCapitalized;
     private final HtmlDocumentationExtractor documentationExtractor;
     private final String gitHubExamplePath;
@@ -39,9 +39,12 @@ public MarkdownDocumentationExamplesGenerator(
           When you have a Behavior and a component, put them in the same package.
          */
         Class<? extends Component> componentClass,
-        String componentName) {
-        this(examplePanelClass, componentClass, componentName, null);
+        String componentName,
+        String componentTitle
+    ) {
+        this(examplePanelClass, componentClass, componentName, componentTitle, null);
     }
+
     public MarkdownDocumentationExamplesGenerator(
         Class<? extends Panel> examplePanelClass,
         /*
@@ -49,8 +52,11 @@ public MarkdownDocumentationExamplesGenerator(
          */
         Class<? extends Component> componentClass,
         String componentName,
-        String renderedHtml) {
+        String componentTitle,
+        String renderedHtml
+    ) {
         this.componentName = componentName;
+        this.componentTitle = componentTitle;
         this.componentNameCapitalized = Strings.capitalize(componentName);
 
         String moduleRootPath = resolveModuleRootPath(GenerateMarkdownAndStorybookExamples.class).getAbsolutePath();
@@ -63,11 +69,9 @@ public MarkdownDocumentationExamplesGenerator(
         String exampleFilenameWithoutExtension = basePathInDocs + examplePanelClass.getSimpleName();
 
         exampleJavaFile = new File(exampleFilenameWithoutExtension + ".java");
-        documentationExtractor =
-            renderedHtml != null
-                ? new HtmlDocumentationExtractor(renderedHtml)
-                : new HtmlDocumentationExtractor(new File(exampleFilenameWithoutExtension + ".html").toPath()
-        );
+        documentationExtractor = renderedHtml != null
+            ? new HtmlDocumentationExtractor(renderedHtml)
+            : new HtmlDocumentationExtractor(new File(exampleFilenameWithoutExtension + ".html").toPath());
 
         markdownReadmeFile = new File(moduleRootPath + "/stories/" + componentName + ".md");
         markdownStorybookFile = new File(moduleRootPath + "/stories/" + componentName + ".mdx");
@@ -156,7 +160,7 @@ private void writeStoryBookFile() throws IOException {
             <Markdown>{markdown}</Markdown>
             """,
             componentName,
-            Strings.capitalize(componentName)
+            componentTitle
         );
 
         Files.write(markdownStorybookFile.toPath(), content.getBytes());