diff --git a/components/wizard/WizardAdminAccount.vue b/components/wizard/WizardAdminAccount.vue
new file mode 100644
index 00000000000..a442d88c1ca
--- /dev/null
+++ b/components/wizard/WizardAdminAccount.vue
@@ -0,0 +1,97 @@
+<template>
+  <validation-observer v-slot="{ invalid }">
+    <v-form ref="form" v-model="validInputs">
+      <validation-provider v-slot="{ errors }" name="username" rules="required">
+        <v-text-field
+          v-model="admin.Name"
+          outlined
+          :label="$t('username')"
+          type="username"
+          :error-messages="errors"
+          required
+        ></v-text-field>
+      </validation-provider>
+      <validation-provider
+        v-slot="{ errors }"
+        rules="bothPasswordsSame:@confirm"
+      >
+        <v-text-field
+          v-model="admin.Password"
+          outlined
+          :label="$t('password')"
+          :append-icon="showPassword ? 'mdi-eye-off' : 'mdi-eye'"
+          :type="showPassword ? 'text' : 'password'"
+          :error-messages="errors"
+          @click:append="() => (showPassword = !showPassword)"
+        ></v-text-field>
+      </validation-provider>
+
+      <validation-provider v-slot="{ errors }" name="confirm" rules="">
+        <v-text-field
+          v-model="passwordCheck"
+          outlined
+          :label="$t('wizard.confirmPassword')"
+          :append-icon="showPassword ? 'mdi-eye-off' : 'mdi-eye'"
+          :type="showPassword ? 'text' : 'password'"
+          :error-messages="errors"
+          @click:append="() => (showPassword = !showPassword)"
+        ></v-text-field>
+      </validation-provider>
+
+      <v-btn color="secondary" @click="$emit('previous-step', { step: 2 })">
+        {{ $t('previous') }}
+      </v-btn>
+      <v-btn
+        color="primary"
+        :disabled="invalid"
+        :loading="loading"
+        @click="createAdminAccount"
+      >
+        {{ $t('next') }}
+      </v-btn>
+    </v-form>
+  </validation-observer>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { mapActions } from 'vuex';
+
+export default Vue.extend({
+  data() {
+    return {
+      admin: {
+        Name: '',
+        Password: ''
+      },
+      passwordCheck: '',
+      showPassword: false,
+      loading: false
+    };
+  },
+  methods: {
+    ...mapActions('snackbar', ['pushSnackbarMessage']),
+    async createAdminAccount(): Promise<void> {
+      this.loading = true;
+      try {
+        const token = `MediaBrowser Client="${this.$store.state.deviceProfile.clientName}", Device="${this.$store.state.deviceProfile.deviceName}", DeviceId="${this.$store.state.deviceProfile.deviceId}", Version="${this.$store.state.deviceProfile.clientVersion}"`;
+        this.$auth.ctx.app.$axios.setHeader('X-Emby-Authorization', token);
+
+        await this.$api.startup.updateStartupUser({
+          startupUserDto: this.admin
+        });
+
+        this.$emit('step-complete', { step: 2 });
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        this.pushSnackbarMessage({
+          message: this.$t('wizard.setAdminError'),
+          color: 'error'
+        });
+      }
+      this.loading = false;
+    }
+  }
+});
+</script>
diff --git a/components/wizard/WizardLanguage.vue b/components/wizard/WizardLanguage.vue
new file mode 100644
index 00000000000..184903b796b
--- /dev/null
+++ b/components/wizard/WizardLanguage.vue
@@ -0,0 +1,81 @@
+<template>
+  <div>
+    <v-select
+      v-model="UICulture"
+      :loading="loading"
+      outlined
+      :label="$t('wizard.preferedLanguage')"
+      required
+      item-text="Name"
+      item-value="Value"
+      :items="culturesList"
+    />
+    <v-btn color="primary" @click="setLanguage">
+      {{ $t('next') }}
+    </v-btn>
+  </div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { mapActions } from 'vuex';
+import {
+  LocalizationOption,
+  StartupConfigurationDto
+} from '@jellyfin/client-axios';
+
+export default Vue.extend({
+  auth: false,
+  data() {
+    return {
+      UICulture: 'en-GB',
+      culturesList: [] as LocalizationOption[],
+      initialConfig: {} as StartupConfigurationDto,
+      loading: false
+    };
+  },
+  async created() {
+    this.loading = true;
+    try {
+      this.initialConfig = (
+        await this.$api.startup.getStartupConfiguration()
+      ).data;
+
+      this.UICulture = this.initialConfig?.UICulture || 'en-GB';
+
+      this.culturesList = (
+        await this.$api.localization.getLocalizationOptions()
+      ).data;
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.error(error);
+    }
+    this.loading = false;
+  },
+  methods: {
+    ...mapActions('snackbar', ['pushSnackbarMessage']),
+    async setLanguage(): Promise<void> {
+      this.loading = true;
+      try {
+        this.$i18n.setLocale(this.UICulture);
+        await this.$api.startup.updateInitialConfiguration({
+          startupConfigurationDto: {
+            ...this.initialConfig,
+            UICulture: this.UICulture
+          }
+        });
+
+        this.$emit('step-complete', { step: 1 });
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        this.pushSnackbarMessage({
+          message: this.$t('wizard.setLanguageError'),
+          color: 'error'
+        });
+      }
+      this.loading = false;
+    }
+  }
+});
+</script>
diff --git a/components/wizard/WizardMetadata.vue b/components/wizard/WizardMetadata.vue
new file mode 100644
index 00000000000..bb0aa379302
--- /dev/null
+++ b/components/wizard/WizardMetadata.vue
@@ -0,0 +1,87 @@
+<template>
+  <div>
+    <v-select
+      v-model="metadataLanguage"
+      outlined
+      :label="$t('metadataLanguage')"
+      required
+      item-text="DisplayName"
+      item-value="TwoLetterISOLanguageName"
+      :items="cultureOptions"
+    />
+    <v-select
+      v-model="metadataCountry"
+      outlined
+      :label="$t('metadataCountry')"
+      required
+      item-text="DisplayName"
+      item-value="TwoLetterISORegionName"
+      :items="countryOptions"
+    />
+    <v-btn color="secondary" @click="$emit('previous-step', { step: 2 })">
+      {{ $t('previous') }}
+    </v-btn>
+    <v-btn :loading="loading" color="primary" @click="setMetadata">{{
+      $t('next')
+    }}</v-btn>
+  </div>
+</template>
+
+<script lang="ts">
+import {
+  CountryInfo,
+  CultureDto,
+  StartupConfigurationDto
+} from '@jellyfin/client-axios';
+import Vue from 'vue';
+import { mapActions } from 'vuex';
+
+export default Vue.extend({
+  data() {
+    return {
+      metadataLanguage: '',
+      metadataCountry: '',
+      initialConfig: {} as StartupConfigurationDto,
+      cultureOptions: [] as CultureDto[],
+      countryOptions: [] as CountryInfo[],
+      loading: false
+    };
+  },
+  async created() {
+    this.initialConfig = (
+      await this.$api.startup.getStartupConfiguration()
+    ).data;
+
+    this.metadataLanguage = this.initialConfig?.MetadataCountryCode || '';
+    this.metadataCountry = this.initialConfig?.PreferredMetadataLanguage || '';
+
+    this.cultureOptions = (await this.$api.localization.getCultures()).data;
+    this.countryOptions = (await this.$api.localization.getCountries()).data;
+  },
+  methods: {
+    ...mapActions('snackbar', ['pushSnackbarMessage']),
+    async setMetadata(): Promise<void> {
+      this.loading = true;
+      try {
+        await this.$api.startup.updateInitialConfiguration({
+          startupConfigurationDto: {
+            ...this.initialConfig,
+            MetadataCountryCode: this.metadataLanguage,
+            PreferredMetadataLanguage: this.metadataCountry
+          }
+        });
+
+        this.$emit('step-complete', { step: 3 });
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        this.pushSnackbarMessage({
+          message: this.$t('wizard.setMetadataError'),
+          color: 'error'
+        });
+      }
+      this.loading = false;
+    }
+  }
+});
+</script>
diff --git a/components/wizard/WizardRemoteAccess.vue b/components/wizard/WizardRemoteAccess.vue
new file mode 100644
index 00000000000..de334213a84
--- /dev/null
+++ b/components/wizard/WizardRemoteAccess.vue
@@ -0,0 +1,54 @@
+<template>
+  <div>
+    <v-checkbox
+      v-model="allowRemoteAccess"
+      :label="$t('wizard.allowRemoteAccess')"
+    />
+    <v-checkbox v-model="enableUPNP" :label="$t('enableUPNP')" />
+    <v-btn color="secondary" @click="$emit('previous-step')">
+      {{ $t('previous') }}
+    </v-btn>
+    <v-btn :loading="loading" color="primary" @click="setRemoteAccess">
+      {{ $t('finish') }}
+    </v-btn>
+  </div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { mapActions } from 'vuex';
+
+export default Vue.extend({
+  data() {
+    return {
+      allowRemoteAccess: false,
+      enableUPNP: false,
+      loading: false
+    };
+  },
+  methods: {
+    ...mapActions('snackbar', ['pushSnackbarMessage']),
+    async setRemoteAccess(): Promise<void> {
+      this.loading = true;
+      try {
+        await this.$api.startup.setRemoteAccess({
+          startupRemoteAccessDto: {
+            EnableRemoteAccess: this.allowRemoteAccess,
+            EnableAutomaticPortMapping: this.enableUPNP
+          }
+        });
+
+        this.$emit('step-complete', { step: 4 });
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        this.pushSnackbarMessage({
+          message: this.$t('wizard.setRemoteError'),
+          color: 'error'
+        });
+      }
+      this.loading = false;
+    }
+  }
+});
+</script>
diff --git a/locales/en-US.json b/locales/en-US.json
index d76ab7b833b..4d42468f6f1 100644
--- a/locales/en-US.json
+++ b/locales/en-US.json
@@ -275,13 +275,33 @@
   "usernameRequired": "Username is required",
   "validation": {
     "mustBeUrl": "This field must be a valid URL",
-    "required": "This field is required"
+    "required": "This field is required",
+    "bothPasswordsSame": "Both passwords must be the save"
   },
   "version": "Version",
   "video": "Video",
   "videoTypes": "Video Types",
   "viewDetails": "View details",
   "vueClientVersion": "Vue client version",
+  "wizard": {
+    "confirmPassword": "Confirm password",
+    "setupWizard": "Setup wizard",
+    "setAdminError": "Unable to create an admin account.",
+    "setLanguageError": "Unable to set client language.",
+    "setMetadataError": "Unable to set metadata languages.",
+    "setRemoteError": "Unable to set remote access settings.",
+    "languageSuccessfullySet": "Language successfully set.",
+    "userSuccessfullySet": "User successfully set.",
+    "metadataLanguagesSet": "Metadata languages set.",
+    "remoteAccessSet": "Remote access set.",
+    "completeError": "Unable to complete startup wizard.",
+    "preferredMetadataLanguage": "Preferred metadata language",
+    "preferedLanguage": "Prefered language",
+    "languageLocale": "Language and locale",
+    "administratorAccount": "Administrator account",
+    "allowRemoteAccess": "Allow remote access to the server",
+    "remoteAccess": "Remote Access"
+  },
   "writer": "Writer",
   "writing": "Writing",
   "year": "Year",
diff --git a/pages/wizard.vue b/pages/wizard.vue
new file mode 100644
index 00000000000..707c80a852f
--- /dev/null
+++ b/pages/wizard.vue
@@ -0,0 +1,156 @@
+<template>
+  <v-container fill-height>
+    <v-row align="center" justify="center">
+      <v-col cols="12" sm="12" md="12" xl="8">
+        <h1 class="text-h4 mb-6 text-center">{{ heading }}</h1>
+        <v-stepper v-model="wizardStage" class="transparent-background">
+          <v-stepper-header>
+            <v-stepper-step
+              :complete="wizardStage > 1"
+              step="1"
+              :editable="maxWizardStage > 0"
+            >
+              {{ $t('wizard.languageLocale') }}
+            </v-stepper-step>
+
+            <v-divider></v-divider>
+
+            <v-stepper-step
+              :complete="wizardStage > 2"
+              step="2"
+              :editable="maxWizardStage > 1"
+            >
+              {{ $t('wizard.administratorAccount') }}
+            </v-stepper-step>
+
+            <v-divider></v-divider>
+
+            <v-stepper-step
+              :complete="wizardStage > 3"
+              step="3"
+              :editable="maxWizardStage > 2"
+            >
+              {{ $t('wizard.preferredMetadataLanguage') }}
+            </v-stepper-step>
+
+            <v-divider></v-divider>
+
+            <v-stepper-step
+              :complete="wizardStage > 4"
+              step="4"
+              :editable="maxWizardStage > 3"
+            >
+              {{ $t('wizard.remoteAccess') }}
+            </v-stepper-step>
+          </v-stepper-header>
+
+          <v-stepper-items>
+            <v-stepper-content step="1">
+              <wizard-language class="pt-4" @step-complete="changeStep" />
+            </v-stepper-content>
+
+            <v-stepper-content step="2">
+              <wizard-admin-account
+                class="pt-4"
+                @step-complete="changeStep"
+                @previous-step="previousStep"
+              />
+            </v-stepper-content>
+
+            <v-stepper-content step="3">
+              <wizard-metadata
+                class="pt-4"
+                @step-complete="changeStep"
+                @previous-step="previousStep"
+              />
+            </v-stepper-content>
+
+            <v-stepper-content step="4">
+              <wizard-remote-access
+                class="pt-4"
+                @step-complete="changeStep"
+                @previous-step="previousStep"
+              />
+            </v-stepper-content>
+          </v-stepper-items>
+        </v-stepper>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>
+
+<script lang="ts">
+import Vue from 'vue';
+import { mapActions } from 'vuex';
+
+export default Vue.extend({
+  layout: 'fullpage',
+  auth: false,
+  data() {
+    return {
+      wizardStage: 1,
+      maxWizardStage: 1
+    };
+  },
+  head() {
+    return {
+      title: this.$store.state.page.title
+    };
+  },
+  computed: {
+    heading(): string {
+      switch (this.wizardStage) {
+        case 1:
+          return this.$t('wizard.languageLocale');
+        case 2:
+          return this.$t('wizard.administratorAccount');
+        case 3:
+          return this.$t('wizard.preferredMetadataLanguage');
+        case 4:
+          return this.$t('wizard.remoteAccess');
+      }
+      return '';
+    }
+  },
+  created() {
+    this.setPageTitle({ title: this.$t('wizard.setupWizard') });
+    this.setDeviceProfile();
+  },
+  methods: {
+    ...mapActions('deviceProfile', ['setDeviceProfile']),
+    ...mapActions('snackbar', ['pushSnackbarMessage']),
+    ...mapActions('page', ['setPageTitle']),
+    async completeWizard(): Promise<void> {
+      try {
+        await this.$api.startup.completeWizard();
+        // Redirect to setup complete page
+        this.$router.push('/login');
+      } catch (error) {
+        // eslint-disable-next-line no-console
+        console.error(error);
+        this.pushSnackbarMessage({
+          message: this.$t('wizard.completeError'),
+          color: 'success'
+        });
+      }
+    },
+    changeStep({ step }: { step: number }): void {
+      if (step === 4) this.completeWizard();
+      else this.wizardStage += 1;
+
+      // This allows the return to previous steps, but not going forward past incomplete steps
+      if (this.wizardStage > this.maxWizardStage)
+        this.maxWizardStage = this.wizardStage;
+    },
+    previousStep(): void {
+      this.wizardStage -= 1;
+    }
+  }
+});
+</script>
+
+<style scoped>
+.transparent-background {
+  background-color: transparent !important;
+}
+</style>
diff --git a/plugins/veeValidate.ts b/plugins/veeValidate.ts
index df443bda56f..81e341ffca3 100644
--- a/plugins/veeValidate.ts
+++ b/plugins/veeValidate.ts
@@ -9,6 +9,15 @@ extend('mustBeUrl', (value: string): boolean => {
   return /^https?:\/\/.+/.test(value);
 });
 
+extend('bothPasswordsSame', {
+  params: ['target'],
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore
+  validate(value, { target }) {
+    return value === target;
+  }
+});
+
 const veeValidate: Plugin = ({ app }) => {
   configure({
     defaultMessage: (_field, values) => {
diff --git a/store/servers.ts b/store/servers.ts
index c7cbbc04c11..87d5f7018c2 100644
--- a/store/servers.ts
+++ b/store/servers.ts
@@ -51,7 +51,7 @@ export const actions: ActionTree<ServerState, ServerState> = {
 
       if (compareVersions.compare(data.Version || '', '10.7.0', '>=')) {
         if (!data.StartupWizardCompleted) {
-          // Redirect To Startup Wizard
+          this.$router.push('/wizard');
         } else {
           commit('SET_SERVER_USED', {
             publicInfo: data,