diff --git a/components/InternalLink.vue b/components/InternalLink.vue
deleted file mode 100644
index a388f04..0000000
--- a/components/InternalLink.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<template>
-  <NuxtLink
-    :to="to"
-    class="inline-flex flex-row items-center gap-1 font-bold text-[var(--brand-blue)]"
-  >
-    <slot />
-  </NuxtLink>
-</template>
-
-<script setup>
-const props = defineProps({
-  to: String,
-})
-</script>
diff --git a/components/Button.vue b/components/NEButton.vue
similarity index 100%
rename from components/Button.vue
rename to components/NEButton.vue
diff --git a/components/ExternalLink.vue b/components/NELink.vue
similarity index 54%
rename from components/ExternalLink.vue
rename to components/NELink.vue
index 24911e9..5eefbba 100644
--- a/components/ExternalLink.vue
+++ b/components/NELink.vue
@@ -1,18 +1,19 @@
 <template>
-  <a
-    :href="to"
-    target="_blank"
-    rel="noopener noreferrer"
-    class="inline-flex flex-row items-center gap-1 font-bold text-[var(--brand-blue)]"
+  <NuxtLink
+    :to="to"
+    :target="external ? '_blank' : ''"
+    :rel="external ? 'noopener noreferrer' : ''"
+    class="inline-flex flex-row items-center gap-1 font-bold text-[var(--brand-blue)] duration-300 active:scale-95"
   >
     <LucideExternalLink v-if="showIcon" />
     <slot />
-  </a>
+  </NuxtLink>
 </template>
 
 <script setup>
 const props = defineProps({
   to: String,
+  external: Boolean,
   showIcon: Boolean,
 })
 </script>
diff --git a/components/Select.vue b/components/NESelect.vue
similarity index 100%
rename from components/Select.vue
rename to components/NESelect.vue
diff --git a/components/ProjectCard.vue b/components/ProjectCard.vue
index 49dab42..5fa8f03 100644
--- a/components/ProjectCard.vue
+++ b/components/ProjectCard.vue
@@ -20,9 +20,9 @@
     </div>
     <!-- Buttons -->
     <div class="flex flex-row flex-wrap gap-3 mb-5">
-      <Button v-for="(link, index) in urls" :to="link" secondary external>
+      <NEButton v-for="(link, index) in urls" :to="link" secondary external>
         <LucideDownload />{{ index }}
-      </Button>
+      </NEButton>
     </div>
   </div>
 </template>
diff --git a/i18n/lang/en-US.json b/i18n/lang/en-US.json
index cf638f1..5fc8a75 100644
--- a/i18n/lang/en-US.json
+++ b/i18n/lang/en-US.json
@@ -21,6 +21,10 @@
       "alternatives": "ALTERNATIVES"
     }
   },
+  "experiments": {
+    "hero": "EXPERIMENTAL FEATURES",
+    "subtitle": "Configure experimental flags for development purposes!"
+  },
   "contributing": {
     "hero": "CONTRIBUTING",
     "subhero": "To the NotEssential website",
diff --git a/layouts/default.vue b/layouts/default.vue
index 08944b6..6a364e0 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -46,10 +46,11 @@
             <div
               class="flex flex-col gap-1 font-[500] text-[var(--text-colour)] text-sm"
             >
-              <ExternalLink
+              <NELink
                 class="font-medium text-white hover:underline"
                 to="https://github.com/blryface/notessential"
-                >{{ $t("layout.footer.open_source") }}</ExternalLink
+                external
+                >{{ $t("layout.footer.open_source") }}</NELink
               >
             </div>
           </div>
@@ -62,14 +63,14 @@
               }}</span>
               <span
                 >{{ $t("layout.footer.credit_creator") }}
-                <ExternalLink to="https://blurryface.xyz"
-                  >Blurryface</ExternalLink
+                <NELink to="https://blurryface.xyz" external
+                  >Blurryface</NELink
                 ></span
               >
               <span
                 >{{ $t("layout.footer.credit_designed") }}
-                <ExternalLink to="https://worldwidepixel.ca"
-                  >WorldWidePixel</ExternalLink
+                <NELink to="https://worldwidepixel.ca" external
+                  >WorldWidePixel</NELink
                 ></span
               >
             </div>
@@ -79,11 +80,11 @@
               <span class="font-bold text-base">{{
                 $t("layout.footer.resources")
               }}</span>
-              <InternalLink to="/contributing"
+              <NELink to="/contributing"
                 ><LucidePenBox class="h-5" />{{
                   $t("layout.footer.contributing")
                 }}
-              </InternalLink>
+              </NELink>
             </div>
             <div
               class="flex flex-col gap-2 font-[500] text-[var(--text-colour)] text-sm"
@@ -91,12 +92,12 @@
               <span class="font-bold text-base">{{
                 $t("layout.footer.interact")
               }}</span>
-              <ExternalLink to="https://crowdin.com/project/notessential"
+              <NELink to="https://crowdin.com/project/notessential" external
                 ><LucideGlobe class="h-5" />Crowdin
-              </ExternalLink>
-              <ExternalLink to="https://discord.gg/wncdz7e8jy"
+              </NELink>
+              <NELink to="https://discord.gg/wncdz7e8jy" external
                 ><LucideMessageCircle class="h-5" />Discord
-              </ExternalLink>
+              </NELink>
             </div>
           </div>
         </div>
diff --git a/pages/flags.vue b/pages/flags.vue
index 72a8792..7add616 100644
--- a/pages/flags.vue
+++ b/pages/flags.vue
@@ -1,8 +1,8 @@
 <template>
   <div class="flex flex-col gap-8">
     <PageHero
-      title="Experimental Features"
-      sub-title="Configure experimental flags for development purposes!"
+      :title="$t('experiments.hero')"
+      :sub-title="$t('experiments.subtitle')"
     />
 
     <div class="flex flex-col gap-3">
@@ -19,15 +19,15 @@
 
         <p>Available langagues:</p>
 
-        <Select v-on:change="handleLanguageChange">
+        <NESelect v-on:change="handleLanguageChange">
           <option
-            v-for="locale in availableLocales"
+            v-for="locale in allLocales"
             :value="locale.code"
             @click="setLocale(locale.code)"
           >
             {{ locale.name }}
           </option>
-        </Select>
+        </NESelect>
       </div>
     </div>
   </div>
@@ -44,6 +44,8 @@ const availableLocales = computed(() => {
   return locales.value.filter((i) => i.code !== locale.value)
 })
 
+const allLocales = locales.value
+
 function handleLanguageChange(event) {
   setLocale(event.target.value)
 }
diff --git a/pages/index.vue b/pages/index.vue
index 61d9afd..1cf5391 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -11,13 +11,15 @@
     </span>
     <!-- THE WORD 'MINECRAFT' AND THE 'NOTESSENTIAL' NAME SHOULD NOT BE LOCALISED. -->
 
+    <Link to="/" show-icon>test.com</Link>
+
     <p class="text-2xl">
       {{ $t("landing.reason") }}
     </p>
 
-    <Button class="w-fit sm:px-20 px-15 py-8" to="/alternatives">
+    <NEButton class="w-fit sm:px-20 px-15 py-8" to="/alternatives">
       <LucideArrowUpRight /> {{ $t("landing.buttons.alternatives") }}
-    </Button>
+    </NEButton>
   </div>
 </template>