diff --git a/package-lock.json b/package-lock.json
index 88d59f97..cbaa4b9f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
 	"name": "harmless_key",
-	"version": "2.20.8",
+	"version": "2.20.10",
 	"lockfileVersion": 2,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "harmless_key",
-			"version": "2.20.8",
+			"version": "2.20.10",
 			"dependencies": {
 				"@octokit/rest": "^19.0.5",
 				"@quasar/extras": "^1.0.0",
diff --git a/package.json b/package.json
index ab29e3cf..b51e10b7 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-	"version": "2.20.8",
+	"version": "2.20.10",
 	"name": "harmless_key",
 	"description": "A Dungeons and Dragons Combat Tracker",
 	"productName": "Harmless Key",
diff --git a/src/assets/_img/atmosphere/medium/homebrew-creation.png b/src/assets/_img/atmosphere/medium/homebrew-creation.png
new file mode 100644
index 00000000..84423f57
Binary files /dev/null and b/src/assets/_img/atmosphere/medium/homebrew-creation.png differ
diff --git a/src/assets/_img/atmosphere/tool-header/homebrew-creation-tool-header.png b/src/assets/_img/atmosphere/tool-header/homebrew-creation-tool-header.png
new file mode 100644
index 00000000..66f7decb
Binary files /dev/null and b/src/assets/_img/atmosphere/tool-header/homebrew-creation-tool-header.png differ
diff --git a/src/assets/_img/homebrew-creation.webp b/src/assets/_img/homebrew-creation.webp
index 540317b1..101a08be 100644
Binary files a/src/assets/_img/homebrew-creation.webp and b/src/assets/_img/homebrew-creation.webp differ
diff --git a/src/assets/_img/tools/homebrew-creation/hbc-logo.webp b/src/assets/_img/tools/homebrew-creation/hbc-logo.webp
new file mode 100644
index 00000000..f7143eb5
Binary files /dev/null and b/src/assets/_img/tools/homebrew-creation/hbc-logo.webp differ
diff --git a/src/components/ContentSideRight.vue b/src/components/ContentSideRight.vue
index a1925b58..f2aecafc 100644
--- a/src/components/ContentSideRight.vue
+++ b/src/components/ContentSideRight.vue
@@ -72,7 +72,7 @@
 		</hk-card>
 
 		<!-- HOMEBREW CREATION -->
-		<hk-card v-if="false">
+		<hk-card>
 			<div
 				slot="image"
 				class="card-image"
@@ -82,15 +82,16 @@
 			</div>
 			<div class="card-body">
 				<p class="text-center">
-					Need a free adventure template, or help forming the basic idea of your adventure?
+					Need a free adventure template, homebrew content or DMing inspiration?
 				</p>
 				<a
 					class="btn btn-block btn-sm"
 					href="http://homebrewcreation.com"
 					rel="noopener"
 					target="_blank"
-					>Start creating</a
 				>
+					Checkout HBC <hk-icon icon="fas fa-external-link" class="ml-2" />
+					</a>
 			</div>
 		</hk-card>
 
diff --git a/src/components/Footer.vue b/src/components/Footer.vue
index 934b3e8d..d5d8eea2 100644
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@@ -81,6 +81,7 @@
 							<li><router-link to="/tools/encounter-builder">Encounter builder</router-link></li>
 							<li><router-link to="/tools/monster-creator">Monster creator</router-link></li>
 							<li><router-link to="/tools/spell-creator">Spell creator</router-link></li>
+							<li><router-link to="/tools/character-sync">Character sync</router-link></li>
 						</ul>
 					</div>
 				</div>
diff --git a/src/components/ToolsPage.vue b/src/components/ToolsPage.vue
index 36d6ed4b..dab597fa 100644
--- a/src/components/ToolsPage.vue
+++ b/src/components/ToolsPage.vue
@@ -8,7 +8,7 @@
       D&D {{ title }}
     </div>
 		<div class="card-body">
-      <SignedIn v-if="user" />
+      <SignedIn v-if="user && showSignedIn" />
       <slot />
     </div>
     <div slot="footer" class="card-footer">
@@ -29,6 +29,10 @@
     props: {
       title: String,
       bg_img: String,
+      showSignedIn: {
+        type: Boolean,
+        default: true
+      }
     },
     computed: {
       ...mapGetters(["user"]),
diff --git a/src/router/routes.js b/src/router/routes.js
index fa9f5cd8..4e521030 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -1,3 +1,4 @@
+
 const Sitemap = () => import("src/views/Pages/Sitemap.vue");
 const Privacy = () => import("src/views/Pages/Privacy.vue");
 const Documentation = () => import("src/views/Pages/Documentation.vue");
@@ -769,6 +770,16 @@ const routes = [
 						"An advanced character builder for D&D 5e. Create a character sheet for you character.",
 				},
 			},
+			{
+				path: "homebrew-creation",
+				name: "ToolsHomebrewCreation",
+				component: () => import("src/views/Tools/HomebrewCreation"),
+				meta: {
+					title: "Homebrew Creation",
+					description:
+						"Homebrew Creation. Because the secret of D&D is: you can create everything yourself",
+				},
+			},
 		],
 	},
 
diff --git a/src/views/Tools/CharacterSync.vue b/src/views/Tools/CharacterSync.vue
index 0779ac37..99f49656 100644
--- a/src/views/Tools/CharacterSync.vue
+++ b/src/views/Tools/CharacterSync.vue
@@ -1,5 +1,9 @@
 <template>
-	<ToolsPage title="Character Sync" bg_img="character-sync-tool-header.png">
+	<ToolsPage
+		title="Character Sync"
+		bg_img="character-sync-tool-header.png"
+		:showSignedIn="false"
+	>
 		<template v-slot:action_btn="{ btn_classes }">
 			<q-btn 
 				color="primary" 
diff --git a/src/views/Tools/EncounterBuilder.vue b/src/views/Tools/EncounterBuilder.vue
index 82ff1dab..16740559 100644
--- a/src/views/Tools/EncounterBuilder.vue
+++ b/src/views/Tools/EncounterBuilder.vue
@@ -37,7 +37,7 @@
 
 		<section class="d-lg-flex justify-between mt-5">
 			<div>
-				<h2>Difficulty</h2>
+				<h2>Encounter Difficulty Calculator</h2>
 				<p>
 					One of the features of our encounter builder is the built-in difficulty calculator. This
 					tool uses the official rules to analyze your encounter and calculate its difficulty level
diff --git a/src/views/Tools/HomebrewCreation.vue b/src/views/Tools/HomebrewCreation.vue
new file mode 100644
index 00000000..860fb884
--- /dev/null
+++ b/src/views/Tools/HomebrewCreation.vue
@@ -0,0 +1,94 @@
+<template>
+	<ToolsPage
+		title="Homebrew Creation"
+		bg_img="homebrew-creation-tool-header.png"
+		:showSignedIn="false"
+	>
+		<template v-slot:action_btn="{ btn_classes }">
+			<q-btn 
+				color="primary" 
+				:class="btn_classes" 
+				no-caps push target="_blank" 
+				rel="noopener" 
+				href="https://homebrewcreation.com/">
+				Checkout HBC <hk-icon icon="fas fa-external-link" class="ml-2" />
+			</q-btn>
+		</template>
+		<section id="hbc">
+			<h2>Adventure templates, homebrew content and DMing inspiration</h2>
+			<p>
+				One of our friends created a platform to offer several tools that are helpful for both beginning and experienced DMs.
+			</p>
+
+			<p>
+				His philosophy: "The secret of D&D is: you can create everything yourself"
+			</p>
+
+			<h3 class="text-bold mb-1">Adventure creation</h3>
+			<p>
+				A three step solution to help you create a one-shot or campaign. We've tried it ourselves and honestly, it was never easier or quicker to fully create a custom one-shot. 
+				By answering a few questions your idea becomes a reality in no time. 
+			</p>
+			<p>
+				<a href="https://homebrewcreation.com/" rel="noopener" target="_blank">Checkout the adventure creation templates</a>
+			</p>
+
+			<h3 class="text-bold mb-1">Homebrew content</h3>
+			<p>
+				He shares his own homebrew content including rules, monsters and classes as an inspiration to help other create their custom content.
+			</p>
+			<p>
+				<a href="https://homebrewcreation.com/dnd-homebrew/" rel="noopener" target="_blank">See all shared homebrew creations</a>
+			</p>
+
+			<h3 class="text-bold mb-1">Articles</h3>
+			<p>
+				Besides sharing his own homebrew creations, he also writes articles. Both guides and opinionated pieces are shared, all about D&D and focussed on DMing.
+			</p>
+			<p>
+				<a href="https://homebrewcreation.com/articles/" rel="noopener" target="_blank">Check the articles</a>
+			</p>
+		</section>
+	</ToolsPage>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+import ToolsPage from "src/components/ToolsPage.vue";
+
+export default {
+	name: "ToolsMonsterCreator",
+	components: {
+		ToolsPage,
+	},
+	computed: {
+		...mapGetters(["user"]),
+	},
+};
+</script>
+
+<style lang="scss" scoped>
+.q-img {
+	display: block;
+	margin: 30px auto;
+	width: 100%;
+
+	&::v-deep .q-img__content {
+		> div {
+			background: none;
+		}
+	}
+	&.res-vul {
+		width: 50%;
+		max-width: 300px;
+	}
+	&.action {
+		max-width: 600px;
+		cursor: pointer;
+	}
+	&.small {
+		max-width: 600px;
+		border-radius: $border-radius;
+	}
+}
+</style>
diff --git a/src/views/Tools/index.vue b/src/views/Tools/index.vue
index b917507a..e09f4a63 100644
--- a/src/views/Tools/index.vue
+++ b/src/views/Tools/index.vue
@@ -5,39 +5,50 @@
 		</div>
 		<div class="card-body">
 			<SignedIn v-if="user" />
-			<div class="row q-col-gutter-md">
-				<div v-for="(tool, key) in tools" class="col-12 col-sm-6 col-md-4" :key="key">
-					<router-link :to="tool.url">
-						<hk-card class="full-height tool">
-							<div
-								slot="image"
-								class="card-image"
-								:style="[
-									tool.image
-										? {
-												backgroundImage: `url(${require(`src/assets/_img/atmosphere/medium/${tool.image}`)})`,
-										  }
-										: '',
-								]"
-							>
-								<i :class="tool.icon" aria-hidden="true" />
-							</div>
-							<div slot="header" class="card-header written">
-								{{ tool.title }}
-							</div>
-							<div class="card-body">
-								{{ tool.description }}
-							</div>
-							<div slot="footer" class="card-footer">
-								<div v-if="tool.under_development" class="red full-width text-center">
-									Under development
+			<h2>
+				Online tools to enhance and simplify every aspect of your tabletop role-playing experience.
+			</h2>
+			<p>
+				Designed with the Dungeon Master in mind, our suite of tools is a comprehensive resource to streamline and enrich every facet of your storytelling journey. 
+				From managing combat encounters with our initiative tracker and creating unique monsters to seamlessly guiding the narrative with a digital DM screen, our tools provide the essential support needed for Dungeon Masters to create immersive and dynamic adventures. 
+				Dive into a realm where our tools serve as your digital assistant, helping you master the art of storytelling and deliver unparalleled experiences to your players.
+			</p>
+			<template v-for="(group, i) in tools">
+				<h2 :key="`title-${i}`" :class="{ 'mt-5': i > 0 }">{{ group.title }}</h2>
+				<div class="row q-col-gutter-md" :key="i" :class="{ 'pb-2': i === 0 }">
+					<div v-for="(tool, key) in group.tools" class="col-12 col-sm-6 col-md-4" :key="key">
+						<router-link :to="tool.url">
+							<hk-card class="full-height tool">
+								<div
+									slot="image"
+									class="card-image"
+									:style="[
+										tool.image
+											? {
+													backgroundImage: `url(${require(`src/assets/_img/atmosphere/medium/${tool.image}`)})`,
+												}
+											: '',
+									]"
+								>
+									<i :class="tool.icon" aria-hidden="true" />
 								</div>
-								<button v-else class="btn btn-block">Use {{ tool.title }}</button>
-							</div>
-						</hk-card>
-					</router-link>
+								<div slot="header" class="card-header written">
+									{{ tool.title }}
+								</div>
+								<div class="card-body">
+									{{ tool.description }}
+								</div>
+								<div slot="footer" class="card-footer">
+									<div v-if="tool.under_development" class="red full-width text-center">
+										Under development
+									</div>
+									<button v-else class="btn btn-block">Use {{ tool.title }}</button>
+								</div>
+							</hk-card>
+						</router-link>
+					</div>
 				</div>
-			</div>
+			</template>
 		</div>
 	</hk-card>
 </template>
@@ -56,69 +67,85 @@ export default {
 	},
 	data() {
 		return {
-			tools: {
-				"combat-tracker": {
-					title: "Combat Tracker",
-					description:
-						"Track everything in your encounters and share initiative with your players.",
-					image: "dragon-encounter-medium.jpg",
-					url: "/tools/combat-tracker",
-					icon: "fas fa-swords",
-				},
-				"encounter-builder": {
-					title: "Encounter Builder",
-					description:
-						"Build encounters and see their difficulty for your party. You can run your encounters in our combat tracker.",
-					image: "encounter-builder-medium.jpg",
-					url: "/tools/encounter-builder",
-					icon: "fas fa-hammer-war",
-				},
-				"dm-screen": {
-					title: "DM Screen",
-					description: "Quick access to rules, a soundboard, your players, your custom encounters and more.",
-					image: "dm-screen-medium.png",
-					url: "/tools/dm-screen",
-					icon: "fas fa-map",
-				},
-				"monster-creator": {
-					title: "Monster Creator",
-					description:
-						"Build custom monster stat blocks with easy to roll actions. You can use your monsters in our combat tracker.",
-					image: "monster-medium.jpg",
-					url: "/tools/monster-creator",
-					icon: "fas fa-dragon",
-				},
-				"spell-creator": {
-					title: "Spell Creator",
-					description:
-						"Create custom spells to roll directly, or use on your spellcaster monsters.",
-					image: "fire-dragon-medium.jpg",
-					url: "/tools/spell-creator",
-					icon: "fas fa-wand-magic",
-				},
-				"character-sync": {
-					title: "Character Sync",
-					description: "Access your characters from external resources and sync them with Harmless Key.",
-					image: "character-sync.png",
-					url: "/tools/character-sync",
-					icon: "fas fa-sync-alt",
-				},
-				compendium: {
-					title: "Compendium",
-					description: "Quickly reference Monsters, Spells, Conditions and Items.",
-					image: "compendium-medium.jpg",
-					url: "/compendium",
-					icon: "fas fa-book-spells",
-				},
-				"Character Builder": {
-					title: "Character Builder",
-					description: "Build your character and get an online character sheet.",
-					image: "characters-medium.jpg",
-					url: "/tools/character-builder",
-					under_development: true,
-					icon: "fas fa-helmet-battle",
-				},
+			tools: [{
+				title: "D&D Tools by Harmless Key",
+				tools: {
+					"combat-tracker": {
+						title: "Combat Tracker",
+						description:
+							"Track everything in your encounters and share initiative with your players.",
+						image: "dragon-encounter-medium.jpg",
+						url: "/tools/combat-tracker",
+						icon: "fas fa-swords",
+					},
+					"encounter-builder": {
+						title: "Encounter Builder",
+						description:
+							"Build encounters and see their difficulty for your party. You can run your encounters in our combat tracker.",
+						image: "encounter-builder-medium.jpg",
+						url: "/tools/encounter-builder",
+						icon: "fas fa-hammer-war",
+					},
+					"dm-screen": {
+						title: "DM Screen",
+						description: "Quick access to rules, a soundboard, your players, your custom encounters and more.",
+						image: "dm-screen-medium.png",
+						url: "/tools/dm-screen",
+						icon: "fas fa-map",
+					},
+					"monster-creator": {
+						title: "Monster Creator",
+						description:
+							"Build custom monster stat blocks with easy to roll actions. You can use your monsters in our combat tracker.",
+						image: "monster-medium.jpg",
+						url: "/tools/monster-creator",
+						icon: "fas fa-dragon",
+					},
+					"spell-creator": {
+						title: "Spell Creator",
+						description:
+							"Create custom spells to roll directly, or use on your spellcaster monsters.",
+						image: "fire-dragon-medium.jpg",
+						url: "/tools/spell-creator",
+						icon: "fas fa-wand-magic",
+					},
+					"character-sync": {
+						title: "Character Sync",
+						description: "Access your characters from external resources and sync them with Harmless Key.",
+						image: "character-sync.png",
+						url: "/tools/character-sync",
+						icon: "fas fa-sync-alt",
+					},
+					compendium: {
+						title: "Compendium",
+						description: "Quickly reference Monsters, Spells, Conditions and Items.",
+						image: "compendium-medium.jpg",
+						url: "/compendium",
+						icon: "fas fa-book-spells",
+					},
+					"Character Builder": {
+						title: "Character Builder",
+						description: "Build your character and get an online character sheet.",
+						image: "characters-medium.jpg",
+						url: "/tools/character-builder",
+						under_development: true,
+						icon: "fas fa-helmet-battle",
+					},
+				}
 			},
+			{
+				title: "D&D Tools by our friends",
+				tools: {
+					"homebrew-creation": {
+						title: "Homebrew Creation",
+						description:
+							"Need a free adventure template, homebrew content or DMing inspiration?",
+						image: "homebrew-creation.png",
+						url: "/tools/homebrew-creation",
+						icon: "fas fa-scroll-old",
+					},
+				}
+			}],
 		};
 	},
 };