diff --git a/docs/resources/docs-style.css b/docs/resources/gh-markdown.css
similarity index 68%
rename from docs/resources/docs-style.css
rename to docs/resources/gh-markdown.css
index c9334aa5..70253fed 100644
--- a/docs/resources/docs-style.css
+++ b/docs/resources/gh-markdown.css
@@ -1,4 +1,8 @@
-/** Github markdown styling (minimized) - plus some small adjustments for PokéSprite */
+/**
+ * Github markdown styling
+ *
+ * Minimized and with some modifications.
+ */
 
 :root {
   --gh-black: #24292e;
@@ -274,7 +278,7 @@
 .markdown-body table,
 .markdown-body ul {
   margin-bottom: 16px;
-  margin-top: 0;
+  margin-top: 16px;
 }
 
 .markdown-body hr {
@@ -586,173 +590,3 @@
 .markdown-body .text-section.last {
   padding-bottom: 2em;
 }
-
-/** Sprite overview table */
-
-.markdown-body .pokesprite {
-  width: 100%;
-}
-.markdown-body .pokesprite tr.header th {
-  text-align: left;
-}
-.markdown-body .pokesprite tr.header th,
-.markdown-body .pokesprite tr.header td {
-  white-space: nowrap;
-}
-.markdown-body .pokesprite thead tr.title th {
-  text-align: left;
-  background: var(--shade-0);
-  line-height: 23px !important;
-}
-.markdown-body .pokesprite thead tr.title th span {
-  font-weight: normal;
-  display: block;
-  font-size: smaller;
-  line-height: 1.5;
-  color: var(--shade-7)
-}
-.markdown-body .pokesprite tbody tr:hover td {
-  background: var(--shade-3);
-}
-.markdown-body .pokesprite tbody tr td[rowspan] {
-  background: var(--shade-0);
-}
-.markdown-body .pokesprite tbody tr td.group {
-  font-weight: 500;
-}
-.markdown-body .pokesprite tbody tr td.item-id {
-  padding-bottom: 0;
-}
-.markdown-body .pokesprite tbody tr td.item-id code {
-  display: inline-block;
-  padding-top: 1px;
-}
-.markdown-body .pokesprite tbody tr.variable-height td {
-  vertical-align: middle;
-}
-.markdown-body .pokesprite tbody attr span {
-  border-bottom: 1px dotted var(--gh-black);
-}
-.markdown-body .pokesprite tbody th,
-.markdown-body .pokesprite tbody td {
-  vertical-align: top;
-  white-space: nowrap;
-  width: 10%;
-}
-.markdown-body .pokesprite tbody td.filler {
-  width: 50%;
-}
-.markdown-body .pokesprite tbody td code {
-  padding: 0;
-  background: transparent;
-}
-/* Image no. column */
-.markdown-body .pokesprite tr.header th:first-child,
-.markdown-body .pokesprite tbody td:first-child {
-  text-align: right;
-  width: 1px;
-}
-/* Slug column - the table is designed so this column fills out most of the remaining space. */
-.markdown-body .pokesprite tr.header th:last-child,
-.markdown-body .pokesprite tbody td:last-child {
-  width: 40%;
-}
-/* Form column - contains the form name, and is optionally followed by one or two td.min nodes. */
-.markdown-body .pokesprite tbody td.form {
-  width: 15%;
-}
-.markdown-body .pokesprite tbody td.min {
-  width: 0.1%;
-  text-align: center;
-  font-size: 14px;
-  font-weight: 500;
-}
-.markdown-body .pokesprite tbody td.min.gender-m {
-  color: #0c8bff;
-}
-.markdown-body .pokesprite tbody td.min.gender-f {
-  color: #ff3b60;
-}
-/* Pokémon sprites */
-.markdown-body .pokesprite tbody img {
-  image-rendering: pixelated;
-  image-rendering: crisp-edges;
-  max-width: inherit;
-}
-.markdown-body .pokesprite tbody td.image {
-  padding-left: 0;
-  padding-right: 0;
-  text-align: center;
-  width: 1px;
-}
-.markdown-body .pokesprite tbody td.image.item {
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.markdown-body .pokesprite tfoot td {
-  line-height: 23px !important;
-}
-.markdown-body .pokesprite tfoot td span {
-  line-height: 1.5;
-  margin-top: 0.5em;
-  font-size: smaller;
-  font-weight: normal;
-  display: block;
-}
-.markdown-body .pokesprite tfoot td span:first-child {
-  margin-top: 0;
-}
-/* Some magic to get border rounding working. */
-.markdown-body .pokesprite {
-  border-collapse: separate;
-}
-.markdown-body .pokesprite td,
-.markdown-body .pokesprite th {
-  border: none;
-  border-top: 1px solid var(--shade-4);
-  border-left: 1px solid var(--shade-4);
-}
-.markdown-body .pokesprite td:last-child,
-.markdown-body .pokesprite th:last-child {
-  border-right: 1px solid var(--shade-4);
-}
-.markdown-body .pokesprite thead tr:first-child th:first-child {
-  border-top-left-radius: var(--rounding);
-}
-.markdown-body .pokesprite thead tr:first-child th:last-child {
-  border-top-right-radius: var(--rounding);
-}
-.markdown-body .pokesprite tfoot tr:last-child td {
-  border-bottom: 1px solid var(--shade-4);
-}
-.markdown-body .pokesprite tfoot tr:last-child td:first-child {
-  border-bottom-left-radius: var(--rounding);
-}
-.markdown-body .pokesprite tfoot tr:last-child td:last-child {
-  border-bottom-right-radius: var(--rounding);
-}
-
-/* Differences per gen. */
-
-.markdown-body .pokesprite th,
-.markdown-body .pokesprite td {
-  line-height: 23px;
-}
-.markdown-body .pokesprite.gen8 th,
-.markdown-body .pokesprite.gen8 td {
-  line-height: 33px;
-}
-.markdown-body .pokesprite tbody img {
-  display: block;
-  margin-left: auto !important;
-  margin-right: auto !important;
-}
-.markdown-body .pokesprite tbody img.i {
-  margin: 2px 0 0 0;
-}
-.markdown-body .pokesprite tbody img.p {
-  margin: -28px 0 -4px 0;
-}
-.markdown-body .pokesprite.gen8 tbody img.p {
-  margin: -18px 0 -4px 0;
-}
diff --git a/docs/resources/pokesprite-docs.css b/docs/resources/pokesprite-docs.css
new file mode 100644
index 00000000..b47babf5
--- /dev/null
+++ b/docs/resources/pokesprite-docs.css
@@ -0,0 +1,181 @@
+/**
+ * Sprite overview table
+ *
+ * See gh-markdown.css for variables.
+ */
+
+/* Column sizes */
+.markdown-body .pokesprite {
+  width: min-content;
+  margin: auto;
+}
+.markdown-body .pokesprite tbody th,
+.markdown-body .pokesprite tbody td {
+}
+.markdown-body .pokesprite tbody td.filler {
+  width: 50%;
+}
+/* Slug column - the table is designed so this column fills out most of the remaining space. */
+.markdown-body .pokesprite tr.header th:last-child,
+.markdown-body .pokesprite tbody td:last-child {
+}
+/* Form column - contains the form name, and is optionally followed by one or two td.min nodes. */
+.markdown-body .pokesprite tbody td.form {
+}
+.markdown-body .pokesprite tbody td.min {
+  width: 0.1%;
+}
+.markdown-body .pokesprite tbody td.image {
+  width: 1px;
+}
+
+/* The rest */
+.markdown-body .pokesprite tr.header th {
+  text-align: left;
+}
+.markdown-body .pokesprite tr.header th,
+.markdown-body .pokesprite tr.header td {
+  white-space: nowrap;
+}
+.markdown-body .pokesprite thead tr.title th {
+  text-align: left;
+  background: var(--shade-0);
+  line-height: 23px !important;
+}
+.markdown-body .pokesprite thead tr.title th span {
+  font-weight: normal;
+  display: block;
+  font-size: smaller;
+  line-height: 1.5;
+  color: var(--shade-7)
+}
+.markdown-body .pokesprite tbody tr:hover td {
+  background: var(--shade-3);
+}
+.markdown-body .pokesprite tbody tr td[rowspan] {
+  background: var(--shade-0);
+}
+.markdown-body .pokesprite tbody tr td.group {
+  font-weight: 500;
+}
+.markdown-body .pokesprite tbody tr td.item-id {
+  padding-bottom: 0;
+}
+.markdown-body .pokesprite tbody tr td.item-id code {
+  display: inline-block;
+  padding-top: 1px;
+}
+.markdown-body .pokesprite tbody tr.variable-height td {
+  vertical-align: middle;
+}
+.markdown-body .pokesprite tbody attr span {
+  border-bottom: 1px dotted var(--gh-black);
+}
+.markdown-body .pokesprite tbody th,
+.markdown-body .pokesprite tbody td {
+  vertical-align: top;
+  white-space: nowrap;
+}
+.markdown-body .pokesprite tbody td code {
+  padding: 0;
+  background: transparent;
+}
+/* Image no. column */
+.markdown-body .pokesprite tr.header th:first-child,
+.markdown-body .pokesprite tbody td:first-child {
+  text-align: right;
+  width: 1px;
+}
+.markdown-body .pokesprite tbody td.min {
+  text-align: center;
+  font-size: 14px;
+  font-weight: 500;
+}
+.markdown-body .pokesprite tbody td.min.gender-m {
+  color: #0c8bff;
+}
+.markdown-body .pokesprite tbody td.min.gender-f {
+  color: #ff3b60;
+}
+/* Pokémon sprites */
+.markdown-body .pokesprite tbody img {
+  image-rendering: pixelated;
+  image-rendering: crisp-edges;
+  max-width: inherit;
+}
+.markdown-body .pokesprite tbody td.image {
+  padding-left: 0;
+  padding-right: 0;
+  text-align: center;
+}
+.markdown-body .pokesprite tbody td.image.item {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+.markdown-body .pokesprite tfoot td {
+  line-height: 23px !important;
+}
+.markdown-body .pokesprite tfoot td span {
+  line-height: 1.5;
+  margin-top: 0.5em;
+  font-size: smaller;
+  font-weight: normal;
+  display: block;
+}
+.markdown-body .pokesprite tfoot td span:first-child {
+  margin-top: 0;
+}
+/* Some magic to get border rounding working. */
+.markdown-body .pokesprite {
+  border-collapse: separate;
+}
+.markdown-body .pokesprite td,
+.markdown-body .pokesprite th {
+  border: none;
+  border-top: 1px solid var(--shade-4);
+  border-left: 1px solid var(--shade-4);
+}
+.markdown-body .pokesprite td:last-child,
+.markdown-body .pokesprite th:last-child {
+  border-right: 1px solid var(--shade-4);
+}
+.markdown-body .pokesprite thead tr:first-child th:first-child {
+  border-top-left-radius: var(--rounding);
+}
+.markdown-body .pokesprite thead tr:first-child th:last-child {
+  border-top-right-radius: var(--rounding);
+}
+.markdown-body .pokesprite tfoot tr:last-child td {
+  border-bottom: 1px solid var(--shade-4);
+}
+.markdown-body .pokesprite tfoot tr:last-child td:first-child {
+  border-bottom-left-radius: var(--rounding);
+}
+.markdown-body .pokesprite tfoot tr:last-child td:last-child {
+  border-bottom-right-radius: var(--rounding);
+}
+
+/* Differences per gen. */
+
+.markdown-body .pokesprite th,
+.markdown-body .pokesprite td {
+  line-height: 23px;
+}
+.markdown-body .pokesprite.gen8 th,
+.markdown-body .pokesprite.gen8 td {
+  line-height: 33px;
+}
+.markdown-body .pokesprite tbody img {
+  display: block;
+  margin-left: auto !important;
+  margin-right: auto !important;
+}
+.markdown-body .pokesprite tbody img.i {
+  margin: 2px 0 0 0;
+}
+.markdown-body .pokesprite tbody img.p {
+  margin: -28px 0 -4px 0;
+}
+.markdown-body .pokesprite.gen8 tbody img.p {
+  margin: -18px 0 -4px 0;
+}
diff --git a/scripts/gen_docs.py b/scripts/gen_docs.py
index 84986133..77bff1cb 100755
--- a/scripts/gen_docs.py
+++ b/scripts/gen_docs.py
@@ -16,6 +16,7 @@
 
 import json
 import subprocess
+import html
 from os import makedirs
 from os.path import abspath, dirname
 from pathlib import Path
@@ -85,12 +86,16 @@ def generate_index_page(version, commit):
   }, 'Index', version, commit, '.')
   return content
 
-def wrap_docs_page(table_content, gen, gen_dir, curr_page, json_file, is_items_page, is_misc_page, version, commit, sprites_counter, new_sprites_only):
+def wrap_docs_page(table_content, gen, gen_dir, curr_page, json_file, title, is_items_page, is_misc_page, version, commit, sprites_counter, new_sprites_only):
   '''Wraps a documentation page in a table node and adds styling'''
   gen_url = f'{REPO_BASE_URL}/{gen_dir}'
   json_url = f'{REPO_BASE_URL}/data/{json_file}'
   gen_link = f'<a href="{gen_url}"><code>{gen_dir}</code></a>'
   json_link = f'<a href="{json_url}"><code>data/{json_file}</code></a>'
+
+  if title is None and gen:
+    title = 'Gen ' + str(gen) + (f' (new sprites only)' if new_sprites_only else '')
+  
   main_info = '''
     <p>This table lists all inventory item sprites. These items are from the last several games and is up-to-date as of Pokémon Sword/Shield. The sprites are from Gen 3 through 8.</p>
     <p>All sprites are 32×32 in size. There are sets of sprites: one with a Sword/Shield style white outline around the sprites, and one without (as all previous games). Both sets contain the same number of sprites.</p>
@@ -124,7 +129,7 @@ def wrap_docs_page(table_content, gen, gen_dir, curr_page, json_file, is_items_p
         %(main_info)s
         <p>See the <a href="%(project_url)s">project page on Github</a> for more information.</a></p>
       </div>
-      <table class="pokesprite gen%(gen)s">
+      <table class="pokesprite%(gen)s">
         %(table_content)s
       </table>
       <div class="text-section last">
@@ -135,7 +140,7 @@ def wrap_docs_page(table_content, gen, gen_dir, curr_page, json_file, is_items_p
   ''' % {
     'table_content': table_content,
     'title_sprite': get_title_venusaur(),
-    'gen': gen,
+    'gen': ' gen%s' % gen if gen else '',
     'main_info': main_info,
     'curr_page': curr_page,
     'version': version,
@@ -143,7 +148,7 @@ def wrap_docs_page(table_content, gen, gen_dir, curr_page, json_file, is_items_p
     'commit': commit,
     'project_url': PROJECT_URL,
     'sprites_counter': sprites_counter
-  }, 'Gen ' + str(gen) + (f' (new sprites only)' if new_sprites_only else ''), version, commit, '..')
+  }, title, version, commit, '..')
 
 def get_menu_links(curr_page):
   menu = [
@@ -166,14 +171,15 @@ def wrap_in_html(content, title, version, commit, res_dir = '.'):
 <html>
   <head>
     <meta charset="utf-8" />
-    <title>PokéSprite - %(title)s</title>
+    <title>PokéSprite%(title)s</title>
     <!--
     PokéSprite - Documentation page
     pokesprite-images v%(version)s %(commit)s
 
     (；ﾟ～ﾟ)ゝ”
     -->
-    <link rel="stylesheet" href="%(res_dir)s/resources/docs-style.css" />
+    <link rel="stylesheet" href="%(res_dir)s/resources/gh-markdown.css" />
+    <link rel="stylesheet" href="%(res_dir)s/resources/pokesprite-docs.css" />
   </head>
   <body>
     %(content)s
@@ -182,7 +188,7 @@ def wrap_in_html(content, title, version, commit, res_dir = '.'):
   '''.strip() % {
     'res_dir': res_dir,
     'content': content,
-    'title': title,
+    'title': ' - ' + title if title else '',
     'version': version,
     'commit': commit
   }
@@ -331,6 +337,7 @@ def get_td_node(td):
   return f'<td{attr}>{td}</td>'
 
 def get_img_node(url, name, form_name, type):
+  form_name = html.escape(form_name)
   return f'<img class="{type}" src="{url}" alt="{form_name}" />'
 
 def reset_counter():
@@ -432,7 +439,7 @@ def generate_misc_table(misc, meta, curr_page, json_file, version = '[unknown]',
   ''')
   buffer.append('</tr>')
   buffer.append('</tfoot>')
-  return wrap_docs_page('\n'.join(buffer), None, None, curr_page, json_file, False, True, version, commit, sprites_counter, False)
+  return wrap_docs_page('\n'.join(buffer), None, None, curr_page, json_file, 'Miscellaneous sprites', False, True, version, commit, sprites_counter, False)
 
 def generate_items_table(itm, itm_unl, inv, etc, dirs, curr_page, json_file, version = '[unknown]', commit = '[unknown]'):
   '''Generates a documentation table for inventory sprites'''
@@ -510,7 +517,7 @@ def generate_items_table(itm, itm_unl, inv, etc, dirs, curr_page, json_file, ver
   ''')
   buffer.append('</tr>')
   buffer.append('</tfoot>')
-  return wrap_docs_page('\n'.join(buffer), None, None, curr_page, json_file, True, False, version, commit, sprites_counter, new_sprites_only)
+  return wrap_docs_page('\n'.join(buffer), None, None, curr_page, json_file, 'Inventory item sprites', True, False, version, commit, sprites_counter, new_sprites_only)
 
 def generate_dex_table(dex, etc, gen, gen_dir, curr_page, json_file, add_female = True, add_right = False, version = '[unknown]', commit = '[unknown]'):
   '''Generates a documentation table for Pokémon sprites'''
@@ -622,7 +629,7 @@ def generate_dex_table(dex, etc, gen, gen_dir, curr_page, json_file, add_female
   ''')
   buffer.append('</tr>')
   buffer.append('</tfoot>')
-  return wrap_docs_page('\n'.join(buffer), gen, gen_dir, curr_page, json_file, False, False, version, commit, sprites_counter, new_sprites_only)
+  return wrap_docs_page('\n'.join(buffer), gen, gen_dir, curr_page, json_file, None, False, False, version, commit, sprites_counter, new_sprites_only)
 
 def main():
   '''Generates several documentation files for the /docs directory'''