diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9efd5f4..73f654c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -20,6 +20,7 @@ As this project is a user-facing application, the places in the semantic version
 ### Changed
 
 - Drop unnecessary async usage of the `js-yaml` package
+- The FormKit and Highlight.js libs are imported dynamically to allow for a smaller main asset chunk
 
 ### Fixed
 
diff --git a/src/components/FormKitWrapper.vue b/src/components/FormKitWrapper.vue
new file mode 100644
index 0000000..33aa109
--- /dev/null
+++ b/src/components/FormKitWrapper.vue
@@ -0,0 +1,17 @@
+<script setup lang="ts">
+/** Wrap any FormKit forms with this to provide our custom config and sync locale. */
+import { watchEffect } from "vue";
+import { useI18n } from "vue-i18n";
+import { changeLocale, FormKitProvider } from "@formkit/vue";
+import { formkitConfig } from "@/formkit";
+
+const { locale } = useI18n();
+
+watchEffect(() => changeLocale(locale.value));
+</script>
+
+<template>
+  <FormKitProvider :config="formkitConfig">
+    <slot />
+  </FormKitProvider>
+</template>
diff --git a/src/corpus/CreateCorpus.vue b/src/corpus/CreateCorpus.vue
index 7343091..23b7194 100644
--- a/src/corpus/CreateCorpus.vue
+++ b/src/corpus/CreateCorpus.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed } from "vue";
 import { useI18n } from "vue-i18n";
+import { FormKit } from "@formkit/vue";
 import PageTitle from "@/components/PageTitle.vue";
 import LayoutSection from "@/components/LayoutSection.vue";
 import useSpin from "@/spin/spin.composable";
@@ -9,6 +10,7 @@ import { FORMATS_EXT, type FileFormat } from "@/api/corpusConfig";
 import { useAuth } from "@/auth/auth.composable";
 import useCreateCorpus from "@/corpus/createCorpus.composable";
 import HelpBox from "@/components/HelpBox.vue";
+import FormKitWrapper from "@/components/FormKitWrapper.vue";
 
 const { requireAuthentication } = useAuth();
 const { createFromConfig } = useCreateCorpus();
@@ -51,60 +53,62 @@ async function submit(fields: Form) {
     <HelpBox>{{ $t("corpus.create.help") }}</HelpBox>
 
     <PendingContent on="create">
-      <FormKit
-        id="create-corpus"
-        v-slot="{ value }"
-        type="form"
-        :submit-label="$t('create')"
-        :submit-attrs="{
-          inputClass: 'mink-button button-primary',
-        }"
-        @submit="submit"
-      >
+      <FormKitWrapper>
         <FormKit
-          :label="$t('name')"
-          type="text"
-          validation="required:trim"
-          name="name"
-          input-class="w-72"
-          :help="$t('metadata.name.help')"
-        />
+          id="create-corpus"
+          v-slot="{ value }"
+          type="form"
+          :submit-label="$t('create')"
+          :submit-attrs="{
+            inputClass: 'mink-button button-primary',
+          }"
+          @submit="submit"
+        >
+          <FormKit
+            :label="$t('name')"
+            type="text"
+            validation="required:trim"
+            name="name"
+            input-class="w-72"
+            :help="$t('metadata.name.help')"
+          />
 
-        <FormKit
-          :label="$t('description')"
-          type="textarea"
-          name="description"
-          :help="$t('metadata.description.help')"
-          input-class="block w-full h-20"
-        />
+          <FormKit
+            :label="$t('description')"
+            type="textarea"
+            name="description"
+            :help="$t('metadata.description.help')"
+            input-class="block w-full h-20"
+          />
 
-        <FormKit
-          name="format"
-          :label="$t('fileFormat')"
-          type="select"
-          input-class="w-72"
-          :help="$t('config.format.help')"
-          :options="formatOptions"
-          validate="required"
-        />
+          <FormKit
+            name="format"
+            :label="$t('fileFormat')"
+            type="select"
+            input-class="w-72"
+            :help="$t('config.format.help')"
+            :options="formatOptions"
+            validate="required"
+          />
 
-        <HelpBox v-if="value!.format === 'pdf'" important>
-          <icon :icon="['far', 'lightbulb']" class="mr-1" />
-          {{ $t("config.format.note.pdf") }}
-        </HelpBox>
+          <HelpBox v-if="value!.format === 'pdf'" important>
+            <icon :icon="['far', 'lightbulb']" class="mr-1" />
+            {{ $t("config.format.note.pdf") }}
+          </HelpBox>
 
-        <FormKit
-          v-if="value!.format === 'xml'"
-          name="textAnnotation"
-          :label="$t('config.text_annotation')"
-          validation="required:trim|matches:/^[^<>\s]*$/"
-          input-class="w-40 font-mono"
-          :help="$t('config.text_annotation.help')"
-        >
-          <template #prefix>&lt;</template>
-          <template #suffix>&gt;</template>
+          <FormKit
+            v-if="value!.format === 'xml'"
+            name="textAnnotation"
+            :label="$t('config.text_annotation')"
+            validation="required:trim|matches:/^[^<>\s]*$/"
+            input-class="w-40 font-mono"
+            :help="$t('config.text_annotation.help')"
+          >
+            <template #prefix>&lt;</template>
+            <template #suffix>&gt;</template>
+          </FormKit>
         </FormKit>
-      </FormKit>
+      </FormKitWrapper>
     </PendingContent>
   </LayoutSection>
 </template>
diff --git a/src/corpus/config/CorpusConfiguration.vue b/src/corpus/config/CorpusConfiguration.vue
index 33d950e..7a836ba 100644
--- a/src/corpus/config/CorpusConfiguration.vue
+++ b/src/corpus/config/CorpusConfiguration.vue
@@ -16,6 +16,7 @@ import {
 import type { ConfigSentenceSegmenter } from "@/api/sparvConfig.types";
 import HelpBox from "@/components/HelpBox.vue";
 import LayoutSection from "@/components/LayoutSection.vue";
+import FormKitWrapper from "@/components/FormKitWrapper.vue";
 import useCorpusIdParam from "@/corpus/corpusIdParam.composable";
 import RouteButton from "@/components/RouteButton.vue";
 import useMessenger from "@/message/messenger.composable";
@@ -25,6 +26,7 @@ import useConfig from "@/corpus/config/config.composable";
 import type { ByLang } from "@/util.types";
 import LayoutBox from "@/components/LayoutBox.vue";
 import TerminalOutput from "@/components/TerminalOutput.vue";
+import { FormKit } from "@formkit/vue";
 
 const router = useRouter();
 const corpusId = useCorpusIdParam();
@@ -118,142 +120,143 @@ async function submit(fields: Form) {
 <template>
   <PendingContent :on="`corpus/${corpusId}/config`">
     <!-- Using the key attribute to re-render whole form after fetching config -->
-    <FormKit
-      id="corpus-config"
-      v-slot="{ value }"
-      :key="config"
-      type="form"
-      :submit-label="$t('save')"
-      :submit-attrs="{
-        inputClass: 'mink-button button-primary',
-      }"
-      @submit="submit"
-    >
-      <LayoutSection :title="$t('metadata')">
-        <HelpBox>
-          <p>{{ $t("config.metadata.help") }}</p>
-        </HelpBox>
-
-        <div class="grid md:grid-cols-2 gap-4">
-          <LayoutBox
-            v-for="(lang2, lang3) of { swe: 'sv', eng: 'en' }"
-            :key="lang3"
-            :title="$t(lang2)"
-          >
-            <FormKit type="group" name="name">
-              <FormKit
-                :name="lang3"
-                :label="$t('name')"
-                :value="configOptions?.name?.[lang3]"
-                :help="$t('metadata.name.help')"
-                type="text"
-                input-class="w-72"
-                validation="required:trim"
-              />
-            </FormKit>
+    <FormKitWrapper :key="config">
+      <FormKit
+        id="corpus-config"
+        v-slot="{ value }"
+        type="form"
+        :submit-label="$t('save')"
+        :submit-attrs="{
+          inputClass: 'mink-button button-primary',
+        }"
+        @submit="submit"
+      >
+        <LayoutSection :title="$t('metadata')">
+          <HelpBox>
+            <p>{{ $t("config.metadata.help") }}</p>
+          </HelpBox>
 
-            <FormKit type="group" name="description">
-              <FormKit
-                :name="lang3"
-                :label="$t('description')"
-                :value="configOptions?.description?.[lang3]"
-                :help="$t('metadata.description.help')"
-                type="textarea"
-                input-class="w-full h-20"
-              />
-            </FormKit>
-          </LayoutBox>
-        </div>
+          <div class="grid md:grid-cols-2 gap-4">
+            <LayoutBox
+              v-for="(lang2, lang3) of { swe: 'sv', eng: 'en' }"
+              :key="lang3"
+              :title="$t(lang2)"
+            >
+              <FormKit type="group" name="name">
+                <FormKit
+                  :name="lang3"
+                  :label="$t('name')"
+                  :value="configOptions?.name?.[lang3]"
+                  :help="$t('metadata.name.help')"
+                  type="text"
+                  input-class="w-72"
+                  validation="required:trim"
+                />
+              </FormKit>
 
-        <FormKit
-          :label="$t('identifier')"
-          type="text"
-          name="identifier"
-          disabled
-          :value="corpusId"
-          :help="$t('metadata.identifier.help')"
-        >
-          <template #input>
-            <TerminalOutput class="inline leading-loose">
-              {{ corpusId }}
-            </TerminalOutput>
-          </template>
-        </FormKit>
-      </LayoutSection>
+              <FormKit type="group" name="description">
+                <FormKit
+                  :name="lang3"
+                  :label="$t('description')"
+                  :value="configOptions?.description?.[lang3]"
+                  :help="$t('metadata.description.help')"
+                  type="textarea"
+                  input-class="w-full h-20"
+                />
+              </FormKit>
+            </LayoutBox>
+          </div>
 
-      <LayoutSection :title="$t('configuration')">
-        <HelpBox>
-          <p>{{ $t("config.configuration.help") }}</p>
-        </HelpBox>
+          <FormKit
+            :label="$t('identifier')"
+            type="text"
+            name="identifier"
+            disabled
+            :value="corpusId"
+            :help="$t('metadata.identifier.help')"
+          >
+            <template #input>
+              <TerminalOutput class="inline leading-loose">
+                {{ corpusId }}
+              </TerminalOutput>
+            </template>
+          </FormKit>
+        </LayoutSection>
 
-        <FormKit
-          name="format"
-          :label="$t('fileFormat')"
-          :value="selectedFormat"
-          type="select"
-          :placeholder="$t('select')"
-          input-class="w-72"
-          :options="formatOptions"
-          validation="required"
-          :help="$t('config.format.help')"
-        />
+        <LayoutSection :title="$t('configuration')">
+          <HelpBox>
+            <p>{{ $t("config.configuration.help") }}</p>
+          </HelpBox>
 
-        <HelpBox v-if="value!.format === 'pdf'" important>
-          <icon :icon="['far', 'lightbulb']" class="mr-1" />
-          {{ $t("config.format.note.pdf") }}
-        </HelpBox>
+          <FormKit
+            name="format"
+            :label="$t('fileFormat')"
+            :value="selectedFormat"
+            type="select"
+            :placeholder="$t('select')"
+            input-class="w-72"
+            :options="formatOptions"
+            validation="required"
+            :help="$t('config.format.help')"
+          />
 
-        <FormKit
-          v-if="value!.format === 'xml'"
-          name="textAnnotation"
-          :label="$t('config.text_annotation')"
-          type="text"
-          :value="configOptions?.textAnnotation"
-          validation="required:trim|matches:/^[^<>\s]*$/"
-          input-class="w-40 font-mono"
-          :help="$t('config.text_annotation.help')"
-        >
-          <template #prefix> &lt; </template>
-          <template #suffix> &gt; </template>
-        </FormKit>
+          <HelpBox v-if="value!.format === 'pdf'" important>
+            <icon :icon="['far', 'lightbulb']" class="mr-1" />
+            {{ $t("config.format.note.pdf") }}
+          </HelpBox>
 
-        <FormKit
-          name="sentenceSegmenter"
-          :label="$t('segmenter_sentence')"
-          :value="configOptions?.sentenceSegmenter || ''"
-          type="radio"
-          :options="segmenterOptions"
-          :help="$t('segmenter_sentence_help')"
-        />
+          <FormKit
+            v-if="value!.format === 'xml'"
+            name="textAnnotation"
+            :label="$t('config.text_annotation')"
+            type="text"
+            :value="configOptions?.textAnnotation"
+            validation="required:trim|matches:/^[^<>\s]*$/"
+            input-class="w-40 font-mono"
+            :help="$t('config.text_annotation.help')"
+          >
+            <template #prefix> &lt; </template>
+            <template #suffix> &gt; </template>
+          </FormKit>
 
-        <FormKit
-          name="datetimeFrom"
-          type="date"
-          :label="`${$t('timespan')}: ${$t('timespan_from')}`"
-          :value="configOptions?.datetimeFrom"
-        />
-        <FormKit
-          name="datetimeTo"
-          type="date"
-          :label="`${$t('timespan')}: ${$t('timespan_to')}`"
-          :value="configOptions?.datetimeTo"
-          :help="$t('timespan_help')"
-        />
+          <FormKit
+            name="sentenceSegmenter"
+            :label="$t('segmenter_sentence')"
+            :value="configOptions?.sentenceSegmenter || ''"
+            type="radio"
+            :options="segmenterOptions"
+            :help="$t('segmenter_sentence_help')"
+          />
 
-        <LayoutSection :title="$t('annotations')">
           <FormKit
-            name="enableNer"
-            :label="$t('annotations.ner')"
-            :value="configOptions?.enableNer"
-            type="checkbox"
-            :help="$t('annotations.ner.help')"
+            name="datetimeFrom"
+            type="date"
+            :label="`${$t('timespan')}: ${$t('timespan_from')}`"
+            :value="configOptions?.datetimeFrom"
           />
+          <FormKit
+            name="datetimeTo"
+            type="date"
+            :label="`${$t('timespan')}: ${$t('timespan_to')}`"
+            :value="configOptions?.datetimeTo"
+            :help="$t('timespan_help')"
+          />
+
+          <LayoutSection :title="$t('annotations')">
+            <FormKit
+              name="enableNer"
+              :label="$t('annotations.ner')"
+              :value="configOptions?.enableNer"
+              type="checkbox"
+              :help="$t('annotations.ner.help')"
+            />
 
-          <!-- eslint-disable-next-line vue/no-v-html -->
-          <div class="prose" v-html="$t('annotations.info')" />
+            <!-- eslint-disable-next-line vue/no-v-html -->
+            <div class="prose" v-html="$t('annotations.info')" />
+          </LayoutSection>
         </LayoutSection>
-      </LayoutSection>
-    </FormKit>
+      </FormKit>
+    </FormKitWrapper>
 
     <div class="flex justify-center items-baseline gap-4">
       <RouteButton :to="`/library/corpus/${corpusId}/config/custom`">
diff --git a/src/i18n/locale.composable.ts b/src/i18n/locale.composable.ts
index 3147776..1690528 100644
--- a/src/i18n/locale.composable.ts
+++ b/src/i18n/locale.composable.ts
@@ -1,20 +1,15 @@
-import { computed, inject, watch } from "vue";
+import { computed, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import { filesize } from "filesize";
 import { useStorage } from "@vueuse/core";
-import { configSymbol } from "@formkit/vue";
 import type { ByLang, SvEn, SweEng } from "@/util.types";
 
 const storedLocale = useStorage<SvEn | "">("locale", "");
 
 export default function useLocale() {
   const { locale } = useI18n();
-  const formkitConfig = inject(configSymbol);
 
   const exportLocale = () => {
-    if (formkitConfig) {
-      formkitConfig.locale = locale.value;
-    }
     document.querySelector("html")?.setAttribute("lang", locale.value);
   };
 
diff --git a/src/main.ts b/src/main.ts
index 46d2837..a420218 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -4,7 +4,6 @@ import { createPinia } from "pinia";
 import router from "@/router/router";
 import App from "@/App.vue";
 import i18n from "@/i18n/i18n";
-import { formkit, formkitConfig } from "@/formkit";
 import { FontAwesomeIcon } from "@/fontawesome";
 import "@/index.css";
 
@@ -14,7 +13,6 @@ const app = createApp(App) //
   .use(router)
   .use(pinia)
   .use(i18n)
-  .use(formkit, formkitConfig)
   .component("icon", FontAwesomeIcon);
 
 // Use the Matomo plugin only if configured in env.
diff --git a/src/metadata/CreateMetadata.vue b/src/metadata/CreateMetadata.vue
index dbb48b1..f2f4983 100644
--- a/src/metadata/CreateMetadata.vue
+++ b/src/metadata/CreateMetadata.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useRouter } from "vue-router";
+import { FormKit } from "@formkit/vue";
 import { useAuth } from "@/auth/auth.composable";
 import useMinkBackend from "@/api/backend.composable";
 import useMessenger from "@/message/messenger.composable";
@@ -7,6 +8,7 @@ import PendingContent from "@/spin/PendingContent.vue";
 import useCreateResource from "@/resource/createResource.composable";
 import PageTitle from "@/components/PageTitle.vue";
 import LayoutSection from "@/components/LayoutSection.vue";
+import FormKitWrapper from "@/components/FormKitWrapper.vue";
 
 const router = useRouter();
 const { requireAuthentication } = useAuth();
@@ -36,31 +38,33 @@ async function submit(fields: Form) {
   <PageTitle>{{ $t("metadata.new") }}</PageTitle>
   <LayoutSection>
     <PendingContent on="create">
-      <FormKit
-        id="create-metadata"
-        type="form"
-        :submit-label="$t('create')"
-        :submit-attrs="{
-          inputClass: 'mink-button button-primary',
-        }"
-        @submit="submit"
-      >
+      <FormKitWrapper>
         <FormKit
-          :label="$t('public_id')"
-          type="text"
-          :validation="[
-            ['required'],
-            ['trim'],
-            ['matches', /^[a-z0-9][a-z0-9-]+[a-z0-9]$/],
-          ]"
-          :validation-messages="{
-            matches: $t('metadata.public_id.error.format'),
+          id="create-metadata"
+          type="form"
+          :submit-label="$t('create')"
+          :submit-attrs="{
+            inputClass: 'mink-button button-primary',
           }"
-          name="publicId"
-          input-class="w-72 font-mono"
-          :help="$t('metadata.public_id.help')"
-        />
-      </FormKit>
+          @submit="submit"
+        >
+          <FormKit
+            :label="$t('public_id')"
+            type="text"
+            :validation="[
+              ['required'],
+              ['trim'],
+              ['matches', /^[a-z0-9][a-z0-9-]+[a-z0-9]$/],
+            ]"
+            :validation-messages="{
+              matches: $t('metadata.public_id.error.format'),
+            }"
+            name="publicId"
+            input-class="w-72 font-mono"
+            :help="$t('metadata.public_id.help')"
+          />
+        </FormKit>
+      </FormKitWrapper>
     </PendingContent>
   </LayoutSection>
 </template>