diff --git a/CHANGELOG.md b/CHANGELOG.md
index 88f7ecf..b18197c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -30,8 +30,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Changed
 
 - **[BREAKING]** Change the `--active` CSS variable to include `scale()` as well.
-- **[BREAKING]** Change the way `--bg-color` works. See [Tricks](https://duckquill.daudix.one/tricks/#background-image) page to see how to make background images work.
-- **[BREAKING]** Rename `config.extra.stylesheets` to `config.extra.styles`.
+- **[BREAKING]** Change the way `--bg-color` CSS variable works. See [Tricks](https://duckquill.daudix.one/tricks/#background-image) page to see how to make background images work.
+- **[BREAKING]** Rename `--primary-color` CSS variable to `--accent-color`.
+- **[BREAKING]** Rename `config.extra.nav.links.sublinks` to `config.extra.nav.links.menu`
+- **[BREAKING]** Rename `config.extra.primary_color` and `config.extra.primary_color_dark` config variables to `config.extra.accent_color` and `config.extra.accent_color_dark`.
+- **[BREAKING]** Rename `config.extra.stylesheets` to `config.extra.styles`. Front matter variables are renamed as well.
 - Allow enabling table of contents on all pages and sections except for the homepage.
 - Allow opening original comment attachment by clicking on it.
 - Allow overriding the `body` block of `base.html.
diff --git a/config.toml b/config.toml
index 9254126..c814910 100644
--- a/config.toml
+++ b/config.toml
@@ -65,12 +65,12 @@ taxonomies = [{ name = "tags", feed = true }]
 #
 # Sets theme and browser theme color.
 # See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta/name/theme-color
-primary_color = "#ff7800"
+accent_color = "#ff7800"
 # Ditto but for the dark theme.
 # If not set regular variant will be used.
-primary_color_dark = "#ffa348"
+accent_color_dark = "#ffa348"
 # Whether to fix low contrast in text selection, checkboxes, etc.
-# Use only if the default doesn't provide enough contrast, e.g. the primary color is set to yellow.
+# Use only if the default doesn't provide enough contrast, e.g. the accent color is set to yellow.
 #
 # fix_contrast = true
 #
@@ -128,7 +128,7 @@ show_repo = true
 # i.e. "@/blog/_index.md".
 # See https://www.getzola.org/documentation/content/linking/#internal-links
 links = [
-	{ name = "Links", sublinks = [
+	{ name = "Links", menu = [
 		{ url = "@/blog/_index.md", name = "Blog" },
 		{ url = "@/demo/index.md", name = "Demo" },
 		{ url = "@/tricks/index.md", name = "Tricks" },
diff --git a/content/_index.md b/content/_index.md
index 881273b..8e1937c 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -25,8 +25,8 @@ Some of the features Duckquill has to offer:
 - Lightweight by default, powerful when needed; no JavaScript is used by default.
 - Privacy respecting analytics using [GoatCounter](https://www.goatcounter.com), with support for self-hosting.
 - Estimated read time of the post; put away those with short attention spans.
-- Everything is tinted with the user-defined primary color for a pleasant look.
 - Light/dark/system theme switcher (for some reason everyone likes these).
+- Everything is tinted with the user-defined accent color for a pleasant look.
 - GitHub-style alerts. Yes, they're pretty, but don't overuse them. 
 - Post banners; they're even used in the social media cards!
 - YouTube/Vimeo shortcodes for easy video embedding.
@@ -159,20 +159,20 @@ styles = [
 ]
 ```
 
-### Primary Color
+### Accent Color
 
-Duckquill respects chosen primary color everywhere. To use your own, simply change the primary color in `config.toml`:
+Duckquill respects chosen accent color everywhere. To use your own, simply change it in `config.toml`:
 
 ```toml
 [extra]
-primary_color = "#3584e4"
+accent_color = "#3584e4"
 ```
 
 Additionally, you can set a separate color for dark mode:
 
 ```toml
 [extra]
-primary_color_dark = "#ff7800"
+accent_color_dark = "#ff7800"
 ```
 
 ### Favicon
diff --git a/content/demo/index.md b/content/demo/index.md
index d9d049c..193fbb3 100644
--- a/content/demo/index.md
+++ b/content/demo/index.md
@@ -645,7 +645,7 @@ URL anchor `#solid` can be used for this as well.
 
 <!-- For the demo purposes only -->
 <div id="color-picker-container">
-  <small>Primary color:</small>
+  <small>Accent color:</small>
   <br />
   <input id="color-picker-light" type="color" value="#ff7800" />
   <label for="color-picker-light">Light theme</label>
@@ -713,21 +713,21 @@ URL anchor `#solid` can be used for this as well.
   const contrastCheckboxLight = document.querySelector("#contrast-color-light");
   const contrastCheckboxDark = document.querySelector("#contrast-color-dark");
 
-  let primaryColorLight = colorPickerLight.value;
-  let primaryColorDark = colorPickerDark.value;
+  let accentColorLight = colorPickerLight.value;
+  let accentColorDark = colorPickerDark.value;
 
-  colorPickerLight.addEventListener("input", updatePrimaryColorLight);
-  colorPickerDark.addEventListener("input", updatePrimaryColorDark);
+  colorPickerLight.addEventListener("input", updateAccentColorLight);
+  colorPickerDark.addEventListener("input", updateAccentColorDark);
   contrastCheckboxLight.addEventListener("change", updateStyles);
   contrastCheckboxDark.addEventListener("change", updateStyles);
 
-  function updatePrimaryColorLight() {
-    primaryColorLight = colorPickerLight.value;
+  function updateAccentColorLight() {
+    accentColorLight = colorPickerLight.value;
     updateStyles();
   }
 
-  function updatePrimaryColorDark() {
-    primaryColorDark = colorPickerDark.value;
+  function updateAccentColorDark() {
+    accentColorDark = colorPickerDark.value;
     updateStyles();
   }
 
@@ -745,14 +745,14 @@ URL anchor `#solid` can be used for this as well.
 
     let styles = `
       :root {
-        --primary-color: ${primaryColorLight};
+        --accent-color: ${accentColorLight};
       }
       [data-theme="dark"] {
-        --primary-color: ${primaryColorDark};
+        --accent-color: ${accentColorDark};
       }
       @media (prefers-color-scheme: dark) {
         :root:not([data-theme="light"]) {
-          --primary-color: ${primaryColorDark};
+          --accent-color: ${accentColorDark};
         }
       }
     `;
diff --git a/sass/_article-list.scss b/sass/_article-list.scss
index 571a194..fc7a24d 100644
--- a/sass/_article-list.scss
+++ b/sass/_article-list.scss
@@ -14,12 +14,12 @@
 		border-radius: var(--rounded-corner);
 		border-start-end-radius: 2.125rem;
 		border-end-end-radius: 1.8125rem;
-		background-color: var(--primary-color-alpha);
+		background-color: var(--accent-color-alpha);
 		padding: 1rem;
 		overflow: hidden;
 
 		&:hover {
-			outline-color: var(--primary-color);
+			outline-color: var(--accent-color);
 			outline-offset: 0.5rem;
 		}
 
@@ -36,11 +36,11 @@
 			justify-content: flex-end;
 
 			a {
-				background-color: var(--primary-color-alpha);
-				color: var(--primary-color);
+				background-color: var(--accent-color-alpha);
+				color: var(--accent-color);
 	
 				&:hover {
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 					color: var(--contrast-color);
 				}
 			}
diff --git a/sass/_buttons.scss b/sass/_buttons.scss
index 7a0bfc7..a2a4371 100644
--- a/sass/_buttons.scss
+++ b/sass/_buttons.scss
@@ -44,11 +44,11 @@ button.inline-button {
 	&.colored {
 		box-shadow: none;
 		background-color: transparent;
-		color: var(--primary-color);
+		color: var(--accent-color);
 
 		&:hover {
 			box-shadow: var(--edge-highlight);
-			background-color: var(--primary-color-alpha);
+			background-color: var(--accent-color-alpha);
 		}
 	}
 }
diff --git a/sass/_code.scss b/sass/_code.scss
index 42c8aed..e2ef381 100644
--- a/sass/_code.scss
+++ b/sass/_code.scss
@@ -62,7 +62,7 @@ pre {
 		border-radius: 0; // Unset code block border radius
 		background-color: var(--fg-muted-1);
 		padding: 0; // Unset mark padding
-		color: var(--fg-color); // Unset mark color from primary color to text color
+		color: var(--fg-color); // Unset mark color from accent color to text color
 	}
 
 	// The line numbers already provide some kind of left/right padding
diff --git a/sass/_comments.scss b/sass/_comments.scss
index ae43fca..78590a2 100644
--- a/sass/_comments.scss
+++ b/sass/_comments.scss
@@ -26,7 +26,7 @@
 		margin-block-start: 2rem;
 
 		#load-comments {
-			--shimmer: rgb(from var(--primary-color) r g b / calc(var(--color-opacity) * 2));
+			--shimmer: rgb(from var(--accent-color) r g b / calc(var(--color-opacity) * 2));
 			background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shimmer) 75%, var(--fg-muted-1) 100%);
 			background-size: 200%;
 			background-color: transparent;
@@ -140,12 +140,12 @@
 					}
 
 					&.op {
-						background-color: var(--primary-color-alpha);
+						background-color: var(--accent-color-alpha);
 						padding-inline-start: 0.625rem;
-						color: var(--primary-color);
+						color: var(--accent-color);
 
 						&:hover {
-							background-color: var(--primary-color);
+							background-color: var(--accent-color);
 							color: var(--contrast-color);
 
 							&::before {
@@ -163,7 +163,7 @@
 							mask-size: cover;
 							transition: var(--transition);
 							margin-inline-end: 0.25rem;
-							background-color: var(--primary-color);
+							background-color: var(--accent-color);
 							width: 0.75rem;
 							height: 0.75rem;
 							content: "";
@@ -195,13 +195,13 @@
 				transition: var(--transition);
 				box-shadow: var(--edge-highlight);
 				border-radius: var(--rounded-corner-small);
-				background-color: var(--primary-color-alpha);
+				background-color: var(--accent-color-alpha);
 				padding: 0.125rem 0.375rem;
 				line-height: 1.25;
 				text-decoration: none;
 
 				&:hover {
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 					color: var(--contrast-color);
 				}
 
diff --git a/sass/_crt.scss b/sass/_crt.scss
index a2ed5e8..df5b0fc 100644
--- a/sass/_crt.scss
+++ b/sass/_crt.scss
@@ -2,23 +2,23 @@
 	margin: 1rem 0 1rem;
 	box-shadow:
 		var(--edge-highlight),
-		0 0 0 0.0625rem var(--primary-color-alpha),
-		0 0.125rem 0.375rem 0.125rem var(--primary-color-alpha),
-		0 0.25rem 1.5rem 0.25rem var(--primary-color-alpha);
+		0 0 0 0.0625rem var(--accent-color-alpha),
+		0 0.125rem 0.375rem 0.125rem var(--accent-color-alpha),
+		0 0.25rem 1.5rem 0.25rem var(--accent-color-alpha);
 	border-radius: var(--rounded-corner);
-	background-image: radial-gradient(color-mix(in srgb, var(--primary-color) 30%, black),
-			color-mix(in srgb, var(--primary-color) 10%, black) 80%,
-			color-mix(in srgb, var(--primary-color) 5%, black));
+	background-image: radial-gradient(color-mix(in srgb, var(--accent-color) 30%, black),
+			color-mix(in srgb, var(--accent-color) 10%, black) 80%,
+			color-mix(in srgb, var(--accent-color) 5%, black));
 
 	pre {
-		--text-shadow-1: hsl(from var(--primary-color) h s l / 0.5);
-		--text-shadow-2: hsl(from var(--primary-color) h calc(s * 2) l);
+		--text-shadow-1: hsl(from var(--accent-color) h s l / 0.5);
+		--text-shadow-2: hsl(from var(--accent-color) h calc(s * 2) l);
 		animation: flicker 0.25s alternate infinite;
 		margin: 0;
 		box-shadow: none;
 		background-color: transparent !important;
 		padding: 1rem 1rem;
-		color: var(--primary-color);
+		color: var(--accent-color);
 		text-shadow:
 			var(--text-shadow-1) 0 0 0.25rem,
 			var(--text-shadow-2) 0 0 0.75rem;
@@ -69,7 +69,7 @@
 	}
 
 	&::after {
-		--scanline-color: rgb(from var(--primary-color) r g b / 0.05);
+		--scanline-color: rgb(from var(--accent-color) r g b / 0.05);
 		display: block;
 		position: absolute;
 		animation: scanline 5s linear infinite;
diff --git a/sass/_external.scss b/sass/_external.scss
index 3352569..7907698 100644
--- a/sass/_external.scss
+++ b/sass/_external.scss
@@ -7,7 +7,7 @@ a.external::after {
 	mask-image: var(--icon);
 	mask-size: cover;
 	margin-inline-start: 0.25rem;
-	background-color: var(--primary-color);
+	background-color: var(--accent-color);
 	width: max(0.75rem, 0.75em);
 	height: max(0.75rem, 0.75em);
 	content: "";
diff --git a/sass/_footer.scss b/sass/_footer.scss
index 1cdbd27..eb57241 100644
--- a/sass/_footer.scss
+++ b/sass/_footer.scss
@@ -44,11 +44,11 @@
 
 			&.active {
 				box-shadow: var(--edge-highlight);
-				background-color: var(--primary-color-alpha);
-				color: var(--primary-color);
+				background-color: var(--accent-color-alpha);
+				color: var(--accent-color);
 
 				&:hover {
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 					color: var(--contrast-color);
 				}
 			}
@@ -122,12 +122,12 @@
 		transition: var(--transition);
 		box-shadow: var(--edge-highlight);
 		border-radius: var(--rounded-corner-small);
-		background-color: var(--primary-color-alpha);
+		background-color: var(--accent-color-alpha);
 		padding: 0.125rem 0.375rem;
 		text-decoration: none;
 
 		&:hover {
-			background-color: var(--primary-color);
+			background-color: var(--accent-color);
 			color: var(--contrast-color);
 		}
 
diff --git a/sass/_footnotes-list.scss b/sass/_footnotes-list.scss
index 5dbfdf5..d362879 100644
--- a/sass/_footnotes-list.scss
+++ b/sass/_footnotes-list.scss
@@ -21,14 +21,14 @@
 		user-select: none;
 
 		&:hover {
-			background-color: var(--primary-color);
+			background-color: var(--accent-color);
 		}
 	}
 
 	a + a[href*="#fr-"],
 	li:target a[href*="#fr-"] {
 		opacity: var(--disabled);
-		background-color: var(--primary-color);
+		background-color: var(--accent-color);
 
 		&:hover {
 			opacity: 1;
diff --git a/sass/_general.scss b/sass/_general.scss
index 634a3de..37f7ff7 100644
--- a/sass/_general.scss
+++ b/sass/_general.scss
@@ -4,8 +4,8 @@
 
 :root {
 	scroll-behavior: smooth;
-	scrollbar-color: var(--primary-color) transparent;
-	accent-color: var(--primary-color);
+	scrollbar-color: var(--accent-color) transparent;
+	accent-color: var(--accent-color);
 	font-size: 16px;
 
 	// Smaller font size on mobile
@@ -27,25 +27,25 @@ body {
 	overflow-wrap: break-word;
 }
 
-// Style text selection to use primary color
+// Style text selection to use accent color
 ::selection {
-	background-color: var(--primary-color);
+	background-color: var(--accent-color);
 	color: var(--contrast-color);
 }
 
 // Make focused anchor not get covered by nav,
-// and flash it with primary color when jumping to it
+// and flash it with accent color when jumping to it
 :target:not(#main) {
 	transition: all var(--transition), scroll-margin-block-start 0s;
 	scroll-margin-block-start: 15vh;
-	color: var(--primary-color);
-	text-shadow: var(--primary-color-alpha) 0 0 0.25rem, var(--primary-color) 0 0 0.75rem;
+	color: var(--accent-color);
+	text-shadow: var(--accent-color-alpha) 0 0 0.25rem, var(--accent-color) 0 0 0.75rem;
 }
 
 // Custom focus indicator
 :focus-visible {
 	animation: focus-in var(--transition);
-	outline: 0.125rem solid var(--primary-color);
+	outline: 0.125rem solid var(--accent-color);
 	outline-offset: 0.125rem;
 }
 
@@ -53,7 +53,7 @@ body {
 @supports not selector(:focus-visible) {
 	:focus {
 		animation: focus-in var(--transition);
-		outline: 0.125rem solid var(--primary-color);
+		outline: 0.125rem solid var(--accent-color);
 		outline-offset: 0.125rem;
 	}
 }
diff --git a/sass/_input.scss b/sass/_input.scss
index e2964f3..6fd200c 100644
--- a/sass/_input.scss
+++ b/sass/_input.scss
@@ -39,11 +39,11 @@ input[type="checkbox"] {
 
 	&:checked {
 		border: 0.15rem solid transparent;
-		background-color: var(--primary-color);
+		background-color: var(--accent-color);
 
 		&:disabled {
 			border: 0.15rem solid transparent;
-			background-color: var(--primary-color-alpha);
+			background-color: var(--accent-color-alpha);
 
 			&::before {
 				opacity: 0.8;
@@ -124,7 +124,7 @@ input[type="checkbox"] {
 		}
 
 		&:checked {
-			background-color: var(--primary-color);
+			background-color: var(--accent-color);
 
 			&::before {
 				transform: translateX(1rem);
@@ -169,7 +169,7 @@ input[type="range"] {
 	transition: var(--transition);
 	box-shadow: var(--edge-highlight);
 	border-radius: 999px;
-	background: var(--primary-color);
+	background: var(--accent-color);
 	width: 100%;
 	height: 0.5rem;
 
diff --git a/sass/_nav.scss b/sass/_nav.scss
index dde76c5..138e2b4 100644
--- a/sass/_nav.scss
+++ b/sass/_nav.scss
@@ -82,11 +82,11 @@
 
 		a.active {
 			box-shadow: var(--edge-highlight);
-			background-color: var(--primary-color-alpha);
-			color: var(--primary-color);
+			background-color: var(--accent-color-alpha);
+			color: var(--accent-color);
 
 			&:hover {
-				background-color: var(--primary-color);
+				background-color: var(--accent-color);
 				color: var(--contrast-color);
 
 				.icon {
@@ -95,7 +95,7 @@
 			}
 
 			.icon {
-				background-color: var(--primary-color);
+				background-color: var(--accent-color);
 			}
 		}
 
@@ -112,7 +112,7 @@
 			}
 
 			&.active {
-				color: var(--primary-color);
+				color: var(--accent-color);
 
 				&:hover {
 					color: var(--contrast-color);
@@ -123,7 +123,7 @@
 				}
 
 				.icon {
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 				}
 			}
 
@@ -317,14 +317,14 @@
 			}
 
 			.active {
-				background-color: var(--primary-color-alpha);
+				background-color: var(--accent-color-alpha);
 
 				.icon {
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 				}
 
 				&:hover {
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 
 					.icon {
 						background-color: var(--contrast-color);
diff --git a/sass/_post-nav.scss b/sass/_post-nav.scss
index 618f061..b684da5 100644
--- a/sass/_post-nav.scss
+++ b/sass/_post-nav.scss
@@ -14,10 +14,10 @@
 
 		&:hover {
 			box-shadow: var(--edge-highlight);
-			background-color: var(--primary-color-alpha);
+			background-color: var(--accent-color-alpha);
 
 			.post-title {
-				color: var(--primary-color);
+				color: var(--accent-color);
 			}
 		}
 
diff --git a/sass/_pre-container.scss b/sass/_pre-container.scss
index 138150a..990fb06 100644
--- a/sass/_pre-container.scss
+++ b/sass/_pre-container.scss
@@ -4,7 +4,7 @@
 	border-radius: var(--rounded-corner);
 
 	.header {
-		--shimmer: rgb(from var(--primary-color) r g b / calc(var(--color-opacity) * 2));
+		--shimmer: rgb(from var(--accent-color) r g b / calc(var(--color-opacity) * 2));
 		border-radius: var(--rounded-corner) var(--rounded-corner) 0 0;
 		background-image: linear-gradient(to right, var(--fg-muted-1) 50%, var(--shimmer) 75%, var(--fg-muted-1) 100%);
 		background-size: 200%;
@@ -70,13 +70,13 @@
 
 			button {
 				box-shadow: var(--edge-highlight);
-				background-color: var(--primary-color-alpha);
+				background-color: var(--accent-color-alpha);
 
 				.icon {
 					--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M7.883 0q-.486.008-.965.074a7.98 7.98 0 0 0-4.602 2.293 8.01 8.01 0 0 0-1.23 9.664 8.015 8.015 0 0 0 9.02 3.684 8 8 0 0 0 5.89-7.75 1 1 0 1 0-2 .008 5.986 5.986 0 0 1-4.418 5.816 5.996 5.996 0 0 1-6.762-2.766 5.99 5.99 0 0 1 .922-7.25 5.99 5.99 0 0 1 7.239-.984 1 1 0 0 0 1.363-.371c.273-.48.11-1.09-.371-1.367A8 8 0 0 0 9.492.14 8 8 0 0 0 7.882 0m7.15 1.998-.1.002a1 1 0 0 0-.687.34L7.95 9.535 5.707 7.29A1 1 0 0 0 4 8a1 1 0 0 0 .293.707l3 3c.195.195.465.3.742.293.277-.012.535-.133.719-.344l7-8A1 1 0 0 0 16 2.934a1 1 0 0 0-.34-.688 1 1 0 0 0-.627-.248'/%3E%3C/svg%3E");
 					-webkit-mask-image: var(--icon);
 					mask-image: var(--icon);
-					background-color: var(--primary-color);
+					background-color: var(--accent-color);
 				}
 			}
 
diff --git a/sass/_tags.scss b/sass/_tags.scss
index 0e15fef..7052b6f 100644
--- a/sass/_tags.scss
+++ b/sass/_tags.scss
@@ -28,13 +28,13 @@
 		white-space: nowrap;
 
 		&:hover {
-			background-color: var(--primary-color-alpha);
-			color: var(--primary-color);
+			background-color: var(--accent-color-alpha);
+			color: var(--accent-color);
 			text-decoration: none;
 
 			.count {
-				background-color: var(--primary-color-alpha);
-				color: var(--primary-color);
+				background-color: var(--accent-color-alpha);
+				color: var(--accent-color);
 			}
 		}
 
diff --git a/sass/_typography.scss b/sass/_typography.scss
index c9e499f..52273af 100644
--- a/sass/_typography.scss
+++ b/sass/_typography.scss
@@ -49,7 +49,7 @@ figcaption {
 blockquote {
 	margin: 0;
 	border-radius: 0.25rem;
-	border-inline-start: 0.25rem solid var(--primary-color);
+	border-inline-start: 0.25rem solid var(--accent-color);
 	padding: 0 0.75rem;
 	color: var(--fg-muted-5);
 }
@@ -65,8 +65,8 @@ q {
 }
 
 mark {
-	background-color: var(--primary-color-alpha);
-	color: var(--primary-color);
+	background-color: var(--accent-color-alpha);
+	color: var(--accent-color);
 }
 
 del {
@@ -111,7 +111,7 @@ progress {
 	background-color: var(--fg-muted-1);
 	width: 100%;
 	height: 0.5rem;
-	color: var(--primary-color);
+	color: var(--accent-color);
 
 	&:indeterminate {
 		background-color: var(--fg-muted-1);
@@ -127,12 +127,12 @@ progress {
 
 	&::-moz-progress-bar {
 		border-radius: 999px;
-		background-color: var(--primary-color);
+		background-color: var(--accent-color);
 	}
 
 	&::-webkit-progress-value {
 		border-radius: 999px;
-		background-color: var(--primary-color);
+		background-color: var(--accent-color);
 	}
 }
 
@@ -159,7 +159,7 @@ kbd {
 }
 
 a {
-	color: var(--primary-color);
+	color: var(--accent-color);
 	font-weight: bold;
 	text-decoration-thickness: max(1px, 0.0625em);
 
@@ -202,7 +202,7 @@ aside {
 	margin-inline-start: 1rem;
 	box-shadow: var(--edge-highlight);
 	border-radius: var(--rounded-corner);
-	background-color: var(--primary-color-alpha);
+	background-color: var(--accent-color-alpha);
 	padding: 1rem;
 	width: 30%;
 
diff --git a/sass/_variables.scss b/sass/_variables.scss
index fd22926..e7b7203 100644
--- a/sass/_variables.scss
+++ b/sass/_variables.scss
@@ -17,7 +17,7 @@
 @include theme-variables using ($theme) {
 	@if $theme == "dark" {
 		// COLORS
-		--bg-color: color-mix(in srgb, var(--primary-color) 10%, black);
+		--bg-color: color-mix(in srgb, var(--accent-color) 10%, black);
 		--fg-color: rgb(255 255 255);
 		--fg-muted-1: rgb(255 255 255 / 0.05);
 		--fg-muted-2: rgb(255 255 255 / 0.1);
@@ -37,7 +37,7 @@
 
 	@else {
 		// COLORS
-		--bg-color: color-mix(in srgb, var(--primary-color) 20%, white);
+		--bg-color: color-mix(in srgb, var(--accent-color) 20%, white);
 		--blue-bg: rgb(from var(--blue-fg) r g b / var(--color-opacity));
 		--blue-fg: rgb(53 132 228);
 		--brown-bg: rgb(from var(--brown-fg) r g b / var(--color-opacity));
@@ -52,7 +52,7 @@
 		--green-bg: rgb(from var(--green-fg) r g b / var(--color-opacity));
 		--green-fg: rgb(38 162 105);
 		--nav-bg: rgb(242 242 242 / 0.7);
-		--primary-color-alpha: rgb(from var(--primary-color) r g b / var(--color-opacity));
+		--accent-color-alpha: rgb(from var(--accent-color) r g b / var(--color-opacity));
 		--purple-bg: rgb(from var(--purple-fg) r g b / var(--color-opacity));
 		--purple-fg: rgb(145 65 172);
 		--red-bg: rgb(from var(--red-fg) r g b / var(--color-opacity));
diff --git a/sass/_zola-anchor.scss b/sass/_zola-anchor.scss
index 1ddef6a..ad4e821 100644
--- a/sass/_zola-anchor.scss
+++ b/sass/_zola-anchor.scss
@@ -16,7 +16,7 @@ h6 {
 	margin: 0 0.25em;
 
 	&:hover .icon {
-		background-color: var(--primary-color);
+		background-color: var(--accent-color);
 	}
 
 	&:active {
@@ -41,5 +41,5 @@ h6 {
 }
 
 :target .zola-anchor .icon {
-	background-color: var(--primary-color-alpha);
+	background-color: var(--accent-color-alpha);
 }
diff --git a/templates/partials/head.html b/templates/partials/head.html
index 1d3852b..46b15cc 100644
--- a/templates/partials/head.html
+++ b/templates/partials/head.html
@@ -3,9 +3,9 @@
 	<meta charset="UTF-8" />
 	<meta name="description" content="{{ config.description }}" />
 	<meta name="viewport" content="width=device-width, initial-scale=1" />
-	<meta name="theme-color" content="{{ config.extra.primary_color | default(value='#9a9996') | safe }}" />
-	{%- if config.extra.primary_color_dark %}
-		<meta name="theme-color" content="{{ config.extra.primary_color_dark | safe }}" media="(prefers-color-scheme:dark)" />
+	<meta name="theme-color" content="{{ config.extra.accent_color | default(value='#9a9996') | safe }}" />
+	{%- if config.extra.accent_color_dark %}
+		<meta name="theme-color" content="{{ config.extra.accent_color_dark | safe }}" media="(prefers-color-scheme:dark)" />
 	{%- endif %}
 	<title>{% include "partials/title.html" %}</title>
 	<link rel="canonical" href="{{ current_url | default(value='/') | safe }}" />
@@ -40,18 +40,18 @@
 
 	<style type="text/css">
 		:root {
-			--primary-color: {{ config.extra.primary_color | default(value="#6f8396") | safe }};
+			--accent-color: {{ config.extra.accent_color | default(value="#6f8396") | safe }};
 			--contrast-color: {% if config.extra.fix_contrast %}rgb(0 0 0 / 0.8){% else %}#fff{% endif %};
 		}
 
-		{%- if config.extra.primary_color_dark %}
+		{%- if config.extra.accent_color_dark %}
 			[data-theme="dark"] {
-				--primary-color: {{ config.extra.primary_color_dark | safe }};
+				--accent-color: {{ config.extra.accent_color_dark | safe }};
 			}
 
 			@media (prefers-color-scheme: dark) {
 				:root:not([data-theme="light"]) {
-					--primary-color: {{ config.extra.primary_color_dark | safe }};
+					--accent-color: {{ config.extra.accent_color_dark | safe }};
 				}
 			}
 		{%- endif %}
@@ -72,7 +72,7 @@
 			*,
 			*::before,
 			*::after {
-				outline: solid 1px var(--primary-color);
+				outline: solid 1px var(--accent-color);
 			}
 		{%- endif -%}
 	</style>
@@ -130,7 +130,7 @@
 		{%- set scripts = scripts | concat(with=["theme-switcher.js"]) %}
 	{%- endif %}
 
-	{%- if config.extra.nav.links.sublinks or config.languages | length > 0 or config.extra.nav.show_theme_switcher %}
+	{%- if config.extra.nav.links.menu or config.languages | length > 0 or config.extra.nav.show_theme_switcher %}
 		{%- set scripts = scripts | concat(with=["details.js"]) %}
 	{%- endif %}
 
diff --git a/templates/partials/nav.html b/templates/partials/nav.html
index cd7a8fa..2180153 100644
--- a/templates/partials/nav.html
+++ b/templates/partials/nav.html
@@ -17,7 +17,7 @@
 			</li>
 			<div class="divider"></div>
 			{%- for link in config.extra.nav.links %}
-				{%- if link.sublinks and link.sublinks | length > 0 -%}
+				{%- if link.menu and link.menu | length > 0 -%}
 					<li>
 						<details>
 							<summary>
@@ -25,23 +25,23 @@
 								{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
 							</summary>
 							<ul>
-								{%- for sublink in link.sublinks -%}
-									{%- if sublink.url is matching('https?://') %}
+								{%- for link in link.menu -%}
+									{%- if link.url is matching('https?://') %}
 										<li>
-											<a href="{{ sublink.url }}" rel="{{ rel_attributes }}"
-												{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == sublink.url | trim_end_matches(pat='/') | safe -%}
+											<a href="{{ link.url }}" rel="{{ rel_attributes }}"
+												{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == link.url | trim_end_matches(pat='/') | safe -%}
 													class="active"
 												{%- endif -%}>
-												{{- macros_translate::translate(key=sublink.name, default=sublink.name, language_strings=language_strings) -}}
+												{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
 											</a>
 										</li>
 									{%- else %}
 										<li>
-											<a href="{{ get_url(path=sublink.url, lang=lang)}}"
-												{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == get_url(path=sublink.url, lang=lang) | trim_end_matches(pat='/') | safe -%}
+											<a href="{{ get_url(path=link.url, lang=lang)}}"
+												{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == get_url(path=link.url, lang=lang) | trim_end_matches(pat='/') | safe -%}
 													class="active"
 												{%- endif -%}>
-												{{- macros_translate::translate(key=sublink.name, default=sublink.name, language_strings=language_strings) -}}
+												{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
 											</a>
 										</li>
 									{%- endif %}