diff --git a/package.json b/package.json
index ce543185..c3a3828c 100644
--- a/package.json
+++ b/package.json
@@ -50,6 +50,7 @@
     "terser-webpack-plugin": "^5.3.9",
     "vue": "^3.3.4",
     "vue-loader": "^17.2.2",
+    "vee-validate": "^4.5.8",
     "vue-material-design-icons": "^5.2.0",
     "vue3-icon": "^2.1.0",
     "webpack": "^5.88.2",
diff --git a/src/vue/.storybook/main.js b/src/vue/.storybook/main.js
index 94a55abb..4ea4cf54 100644
--- a/src/vue/.storybook/main.js
+++ b/src/vue/.storybook/main.js
@@ -1,7 +1,8 @@
 /** @type { import('@storybook/vue3-webpack5').StorybookConfig } */
 const webpack = require("webpack");
 const path = require("path");
-const config = {
+
+module.exports = {
   stories: ["../**/*.stories.@(js|jsx|mjs|ts|tsx)"],
   addons: [
     "storybook-addon-sass-postcss",
@@ -18,13 +19,14 @@ const config = {
   },
   staticDirs: [path.resolve(__dirname, "../assets")],
   webpackFinal: async (config) => {
+    // Define global constants that can be accessed in your stories
     config.plugins.push(
       new webpack.DefinePlugin({
         SERVER: JSON.stringify("http://localhost:6006/"),
       })
     );
+    
     return config;
   },
 };
 
-export default config;
diff --git a/src/vue/.storybook/preview-head.html b/src/vue/.storybook/preview-head.html
index 34e35130..f9ffcc5d 100644
--- a/src/vue/.storybook/preview-head.html
+++ b/src/vue/.storybook/preview-head.html
@@ -1,11 +1,12 @@
-<!-- .storybook/preview-head.html -->
 
-<!-- Pull in static files served from your Static directory or the internet -->
-<!-- Example: `main.js|ts` is configured with staticDirs: ['../public'] and your font is located in the `fonts` directory inside your `public` directory -->
-<link rel="preload" href="/fonts/MontserratBold.woff2" />
-<link rel="preload" href="/fonts/MontserratRegular.woff2" />
-<link rel="preload" href="/fonts/MontserratMedium.woff2" />
+<!-- Preload fonts for better performance -->
+<link rel="preload" href="/fonts/MontserratBold.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+<link rel="preload" href="/fonts/MontserratRegular.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+<link rel="preload" href="/fonts/MontserratMedium.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
 
-<link rel="preload" href="/fonts/RobotoBold.woff2" />
-<link rel="preload" href="/fonts/RobotoRegular.woff2" />
-<link rel="preload" href="/fonts/RobotoMedium.woff2" />
+<link rel="preload" href="/fonts/RobotoBold.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+<link rel="preload" href="/fonts/RobotoRegular.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+<link rel="preload" href="/fonts/RobotoMedium.woff2" as="font" type="font/woff2" crossorigin="anonymous" />
+
+<!-- Include custom fonts stylesheet -->
+<link rel="stylesheet" href="/fonts.css">
diff --git a/src/vue/assets/fonts.css b/src/vue/assets/fonts.css
new file mode 100644
index 00000000..2a95ad18
--- /dev/null
+++ b/src/vue/assets/fonts.css
@@ -0,0 +1,72 @@
+/* Montserrat Font Family */
+@font-face {
+    font-family: 'Montserrat';
+    font-style: normal;
+    font-stretch: normal;
+    font-family: 'Montserrat';
+    src: url('/fonts/MontserratRegular.woff2') format('woff2'),
+         url('/fonts/MontserratRegular.woff') format('woff');
+    font-weight: 400;
+}
+
+@font-face {
+    font-family: 'Montserrat';
+    src: url('/fonts/MontserratRegular.woff2') format('woff2'),
+         url('/fonts/MontserratRegular.woff') format('woff');
+    font-weight: 400;
+}
+
+@font-face {
+    font-family: 'Montserrat';
+    src: url('/fonts/MontserratMedium.woff2') format('woff2'),
+         url('/fonts/MontserratMedium.woff') format('woff');
+    font-weight: 500;
+}
+
+@font-face {
+    font-family: 'Montserrat';
+    src: url('/fonts/MontserratSemiBold.woff2') format('woff2'),
+         url('/fonts/MontserratSemiBold.woff') format('woff');
+    font-weight: 600;
+}
+
+@font-face {
+    font-family: 'Montserrat';
+    src: url('/fonts/MontserratBold.woff2') format('woff2'),
+         url('/fonts/MontserratBold.woff') format('woff');
+    font-weight: 700;
+}
+
+/* Roboto Font Family */
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'Roboto';
+    src: url('/fonts/RobotoRegular.woff2') format('woff2'),
+         url('/fonts/RobotoRegular.woff') format('woff');
+    font-weight: normal;
+}
+
+@font-face {
+    font-family: 'Roboto';
+    src: url('/fonts/RobotoMedium.woff2') format('woff2'),
+         url('/fonts/RobotoMedium.woff') format('woff');
+    font-weight: 500;
+}
+
+@font-face {
+    font-family: 'RobotoBold';
+    src: url('/fonts/RobotoBold.woff2') format('woff2'),
+         url('/fonts/RobotoBold.woff') format('woff');
+    font-weight: 700;
+}
+
+/* Body */
+body {
+    font-family: 'Roboto', sans-serif;
+}
+
+ 
diff --git a/src/vue/components/Button.vue b/src/vue/components/Button.vue
index 3dada6cf..ed7dd0a5 100644
--- a/src/vue/components/Button.vue
+++ b/src/vue/components/Button.vue
@@ -2,7 +2,7 @@
   <button
     :class="[
       { btn: true },
-      { 'btn--filled': type === undefined || type === 'filled' },
+      { 'btn--filled': type === undefined || type === 'submit' || type === 'filled' },
       { 'btn--outlined': type === 'outlined' },
       { 'btn--sm': size === 'sm' },
       { 'btn--md': size === undefined || size === 'md' },
diff --git a/src/vue/components/checkbox-input/CheckboxInput.stories.js b/src/vue/components/checkbox-input/CheckboxInput.stories.js
new file mode 100644
index 00000000..1d60938a
--- /dev/null
+++ b/src/vue/components/checkbox-input/CheckboxInput.stories.js
@@ -0,0 +1,24 @@
+import CheckboxInput from "./CheckboxInput.vue";
+
+export default {
+  title: "Components/CheckboxInput",
+  component: CheckboxInput,
+  argTypes: {
+    label: { control: "text" },
+    name: { control: "text" },
+  },
+};
+
+const Template = (args) => ({
+  components: { CheckboxInput },
+  setup() {
+    return { args };
+  },
+  template: '<CheckboxInput v-bind="args"></CheckboxInput>',
+});
+
+export const Default = Template.bind({});
+Default.args = {
+  label: "Checkbox label",
+  name: "staySignedIn",
+};
diff --git a/src/vue/components/checkbox-input/CheckboxInput.vue b/src/vue/components/checkbox-input/CheckboxInput.vue
new file mode 100644
index 00000000..cca27c2d
--- /dev/null
+++ b/src/vue/components/checkbox-input/CheckboxInput.vue
@@ -0,0 +1,95 @@
+<template>
+  <label class="checkbox-input" :for="name">
+    <input :id="name" v-model="modelValue" type="checkbox" class="checkbox-input__checkbox" />
+    <span class="checkbox-input__label">
+      {{ label }}
+    </span>
+  </label>
+</template>
+
+<script>
+import { ref, watch } from 'vue'
+import { useField } from 'vee-validate'
+
+export default {
+  name: 'CheckboxInput',
+  props: {
+    name: String,
+    label: String,
+  },
+  setup() {
+    const modelValue = ref(false)
+    const { value: fieldValue } = useField(props.name)
+
+    watch(modelValue, (newValue) => {
+      console.log('model value is', modelValue)
+      fieldValue.value = newValue
+    })
+    return {
+      modelValue,
+    }
+  },
+}
+</script>
+
+<style lang="scss">
+.checkbox-input {
+  display: flex;
+  justify-content: flex-start;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+
+  &__label {
+    font-size: 0.85rem;
+
+    /* Custom checkbox styling */
+    input[type="checkbox"] {
+      /* Hide the default checkbox input */
+      position: absolute;
+      opacity: 0;
+
+      /* Style the checkmark container */
+      &~.checkmark {
+        position: relative;
+        width: 1rem;
+        /* Increase the width for a larger checkbox */
+        height: 1rem;
+        /* Increase the height for a larger checkbox */
+        background-color: #ffffff;
+        border-radius: 0.25rem;
+        border: 0.0625rem solid #bfbfbf;
+
+        /* Style the checkmark indicator (hidden when unchecked) */
+        &:after {
+          content: "";
+          position: absolute;
+          display: none;
+        }
+      }
+
+      /* Show the checkmark when checked */
+      &:checked~.checkmark:after {
+        display: block;
+      }
+    }
+
+    /* Style the checkmark/indicator */
+    input[type="checkbox"]~.checkmark:after {
+      content: "";
+      position: absolute;
+      left: 0.5rem;
+      /* Adjust the position of the checkmark */
+      top: 0.9rem;
+      /* Adjust the position of the checkmark */
+      width: .5rem;
+      height: 1rem;
+      border: solid white;
+      border-width: 0 0.25rem 0.25rem 0;
+      /* Adjust the size of the checkmark */
+      transform: rotate(45deg);
+    }
+  }
+}
+</style>
+
+
diff --git a/src/vue/components/link/Link.stories.js b/src/vue/components/link/Link.stories.js
new file mode 100644
index 00000000..a5db9a6f
--- /dev/null
+++ b/src/vue/components/link/Link.stories.js
@@ -0,0 +1,25 @@
+import { defineComponent } from "vue";
+
+import Link from "./Link.vue"; // Import your Link component
+
+export default {
+  title: "Components/Link",
+  component: Link,
+  argTypes: {
+    url: { control: "text" },
+  },
+};
+
+const Template = (args) =>
+  defineComponent({
+    components: { Link },
+    setup() {
+      return { args };
+    },
+    template: '<Link v-bind="args">Gå til siden</Link>',
+  });
+
+export const Default = Template.bind({});
+Default.args = {
+  url: "https://example.com",
+};
diff --git a/src/vue/components/link/Link.vue b/src/vue/components/link/Link.vue
new file mode 100644
index 00000000..27e26688
--- /dev/null
+++ b/src/vue/components/link/Link.vue
@@ -0,0 +1,35 @@
+<template>
+  <a :href="url" class="link">
+    <slot></slot>
+  </a>
+</template>
+<script>
+import { defineComponent } from "vue";
+
+export default defineComponent({
+  props: {
+    url: String,
+  },
+});
+</script>
+
+<style lang="scss">
+@import "../../design/semantic-colors";
+.link {
+  color: black;
+  cursor: pointer;
+  &__text {
+    color: #000;
+    font-family: Montserrat;
+    font-size: 0.85rem;
+    font-style: normal;
+    font-weight: 400;
+    line-height: normal;
+  }
+
+  &:hover {
+    text-decoration: underline;
+    color: map-get($semantic-colors, hover);
+  }
+}
+</style>
diff --git a/src/vue/components/login-form/LoginForm.stories.js b/src/vue/components/login-form/LoginForm.stories.js
new file mode 100644
index 00000000..555c1835
--- /dev/null
+++ b/src/vue/components/login-form/LoginForm.stories.js
@@ -0,0 +1,24 @@
+import { defineComponent } from "vue";
+import LoginForm from "./LoginForm.vue";
+
+export default {
+  title: "Components/LoginForm",
+  component: LoginForm,
+};
+
+const Template = (args) =>
+  defineComponent({
+    components: { LoginForm },
+    setup() {
+      return args;
+    },
+    template:
+      '<div style="max-width:700px;display:flex;alignContent:center;justifyContent:center;padding:30px"><LoginForm v-bind="args" /></div>',
+  });
+
+export const Default = Template.bind({});
+Default.args = {
+  email: "",
+  password: "",
+  stayLoggedIn: false,
+};
diff --git a/src/vue/components/login-form/LoginForm.vue b/src/vue/components/login-form/LoginForm.vue
new file mode 100644
index 00000000..91543d7a
--- /dev/null
+++ b/src/vue/components/login-form/LoginForm.vue
@@ -0,0 +1,104 @@
+<template>
+  <div class="login-form">
+    <h1 class="login-form__title">Logg inn på kompetanse portalen</h1>
+    <form @submit.prevent="submitForm" class="login-form__form" autocomplete="off">
+      <TextInput v-model="email" name="Email" label="Epost" type="email" placeHolder="navn@eksempel.no" />
+      <TextInput v-model="password" name="Password" label="Passord" type="password" />
+      <CheckboxInput v-model="stayLoggedIn" name="stayLoggedIn" label="Forbli logget inn" />
+      <div class="login-form__action-container">
+        <Button type="submit">Logg inn</Button>
+        <Link url="www.example.com">Glemt passord?</Link>
+      </div>
+      <h2 class="login-form__title2">Opprette ny bruker?</h2>
+      <p class="login-form__new-user"> For å opprette bruker i kompetanseportalen, må du være registrert i en
+        kompetansepakke. Dette gjør du ved å velge en kompetansepakke fra kompetanse.udir.no og registrere deg på denne
+        ved hjelp av din e-postadresse. </p>
+    </form>
+  </div>
+</template>
+
+<script>
+import { useForm, useField } from "vee-validate"
+import Button from "../Button.vue"
+import TextInput from "../text-input/TextInput.vue"
+import CheckboxInput from "../checkbox-input/CheckboxInput.vue"
+import Link from "../link/Link.vue"
+
+export default {
+  components: {
+    CheckboxInput,
+    TextInput,
+    Button,
+    Link,
+  },
+  setup() {
+    const { handleSubmit } = useForm()
+
+    const email = useField("email")
+    const password = useField("password")
+    const stayLoggedIn = useField("stayLoggedIn")
+
+    const submitForm = handleSubmit(async () => {
+      // Handle login logic here
+      if (!(await email.validate()) || !(await password.validate())) {
+        return
+      }
+      console.log("Logging in...")
+    })
+
+    return {
+      email,
+      password,
+      stayLoggedIn,
+      submitForm,
+    }
+  },
+}
+</script>
+
+<style scoped lang="scss">
+@import "../../design/colors";
+
+.login-form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 2rem 0;
+
+  &__title {
+    color: map-get($color-palette-steel, background, 700);
+    font-family: Montserrat, sans-serif;
+    font-size: 1.25rem;
+    font-weight: 700;
+    margin-bottom: 1rem;
+  }
+
+  &__form {
+    margin-top: 1rem;
+  }
+
+  &__title2 {
+    color: $color-black;
+    font-family: Montserrat, sans-serif;
+    font-size: 1rem;
+    font-weight: 700;
+    margin-top: 2rem;
+  }
+
+  &__action-container {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-top: 2rem;
+    margin-bottom: 2rem;
+  }
+
+  &__new-user {
+    color: $color-black;
+    font-family: Roboto, sans-serif;
+    font-size: 1rem;
+    font-weight: 400;
+    line-height: 1.5;
+  }
+}
+</style>
diff --git a/src/vue/components/text-input/TextInput.stories.js b/src/vue/components/text-input/TextInput.stories.js
new file mode 100644
index 00000000..c97a0980
--- /dev/null
+++ b/src/vue/components/text-input/TextInput.stories.js
@@ -0,0 +1,39 @@
+import TextInput from "./TextInput.vue";
+
+export default {
+  title: "Components/TextInput",
+  component: TextInput,
+  argTypes: {
+    label: { control: "text" },
+    name: { control: "text" },
+    rules: { control: "text" },
+    type: { control: "text" },
+    modelValue: { control: "text" },
+  },
+};
+
+const Template = (args) => ({
+  components: { TextInput },
+  setup() {
+    return { args };
+  },
+  template: '<TextInput v-bind="args" />',
+});
+
+export const Email = Template.bind({});
+Email.args = {
+  label: "E-post",
+  name: "email",
+  rules: "required|min:3",
+  type: "email",
+  modelValue: "",
+};
+
+export const Password = Template.bind({});
+Password.args = {
+  label: "Passord",
+  name: "password",
+  rules: "required|min:8",
+  type: "password",
+  modelValue: "",
+};
diff --git a/src/vue/components/text-input/TextInput.vue b/src/vue/components/text-input/TextInput.vue
new file mode 100644
index 00000000..e4ca7a70
--- /dev/null
+++ b/src/vue/components/text-input/TextInput.vue
@@ -0,0 +1,145 @@
+<template>
+  <div class="form-field">
+    <label :for="name" class="form-field__label">{{ label }}</label>
+    <div :class="{
+      'form-field__input': true,
+      'form-field__input--error': hasError,
+    }">
+        <div class="error-icon" v-if="hasError">
+          <AlertCircle-Icon></AlertCircle-Icon>
+        </div>
+        <input autocomplete="off" :id="name" :type="type" :class="{ 'input-error': hasError }" v-model="modelValue"
+          :placeholder="placeHolder" @input="$emit('update:modelValue', $event)" />
+      </div>
+        <div class="form-field__error" v-if="hasError">{{ errors[0] }}</div>
+  </div>
+</template>
+
+<script>
+import { ref, watch } from "vue"
+import { useField } from "vee-validate"
+import AlertCircleIcon from 'vue-material-design-icons/AlertCircle.vue'
+
+export default {
+  props: {
+    name: String,
+    label: String,
+    placeHolder: String,
+    type: String,
+    rules: Object,
+  },
+  components: {
+    AlertCircleIcon
+  },
+  setup(props, { emit }) {
+    const modelValue = ref("")
+    const { value: fieldValue, errors } = useField(props.name, props.rules)
+
+    watch(modelValue, (newValue) => {
+      fieldValue.value = newValue
+    })
+
+    const hasError = ref(false)
+
+
+    watch(errors, (newErrors) => {
+      hasError.value = newErrors.length > 0
+    })
+
+    return {
+      modelValue,
+      errors,
+      hasError,
+    }
+  },
+}
+</script>
+
+<style lang="scss">
+@import "../../design/colors.scss";
+@import "../../design/semantic-colors.scss";
+@import "../../design/box-shadow.scss";
+@import "../../design/shake-effect.scss";
+
+.form-field {
+  width: 100%;
+  font-family: Roboto;
+  display: flex;
+  flex-direction: column;
+  margin-bottom: 1rem;
+
+  &__label {
+    box-sizing: border-box;
+    color: $color-black;
+    cursor: default;
+    display: inline-block;
+    font-size: 0.85rem;
+    font-weight: 500;
+    padding-bottom: 0.5rem;
+  }
+
+  &__input {
+    border-top-left-radius: 0.25rem;
+    border-top-right-radius: 0.25rem;
+    border-bottom: 3px solid $color-black;
+    background-color: $color-grey-100;
+    height: 2.5rem;
+    width: 100%;
+    display: flex;
+    justify-content: flex-start;
+
+    &:hover {
+      background-color: map-get($color-palette-azur, background, 300);
+    }
+
+    &:focus-within {
+      border-color: map-get($color-palette-slate, background, 400);
+      @include box-shadow('small');
+      background-color: map-get($color-palette-azur, background, 300);
+    }
+
+    &:focus:not(:focus-visible) {
+      outline: none;
+    }
+
+    &--error {
+      border-bottom: 3px solid map-get($semantic-colors, error, foreground);
+
+      .error-icon {
+        color: map-get($semantic-colors, error, foreground);
+        display: flex;
+        place-content: center;
+        margin-top: 0.25rem;
+        margin-left: 0.25rem;
+        @include shake-effect();
+      }
+    }
+
+    input {
+      box-sizing: border-box;
+      font-family: "Roboto";
+      border-top-left-radius: 0.25rem;
+      border-top-right-radius: 0.25rem;
+      font-size: 1rem;
+      font-weight: 400;
+      line-height: 1.5;
+      width: 100%;
+      flex: 1 1 0%;
+      height: 100%;
+      background-color: inherit;
+      padding: 0 1rem;
+      color: $color-grey-900;
+      outline: none;
+      border: none;
+    }  
+  }
+
+  &__error {
+    margin-top: 0.25rem;
+    color: map-get($semantic-colors, error, foreground);
+    background: map-get($semantic-colors, error, background);
+    font-size: 0.875rem;
+    padding: 0.025rem;
+  }
+}
+</style>
diff --git a/src/vue/design/_box-shadow.scss b/src/vue/design/_box-shadow.scss
new file mode 100644
index 00000000..d8cdf992
--- /dev/null
+++ b/src/vue/design/_box-shadow.scss
@@ -0,0 +1,12 @@
+$box-shadow-small: 0 0.1rem 0.2rem rgba(19, 19, 19, 0.15);
+$box-shadow-medium: 0 0.2rem 0.3rem rgba(19, 19, 19, 0.35);
+
+@mixin box-shadow($size: small) {
+  @if $size == small {
+    box-shadow: $box-shadow-small;
+  } @else if $size == medium {
+    box-shadow: $box-shadow-medium;
+  } @else {
+    box-shadow: 0;
+  }
+}
diff --git a/src/vue/design/_semantic-colors.scss b/src/vue/design/_semantic-colors.scss
new file mode 100644
index 00000000..3b12ad95
--- /dev/null
+++ b/src/vue/design/_semantic-colors.scss
@@ -0,0 +1,23 @@
+@import "./colors.scss";
+
+// Define semantic colors using a more structured format
+$semantic-colors: (
+  success: (
+    background: map-get($color-palette-green, background, 200),
+    foreground: map-get($color-palette-green, background, 600),
+  ),
+  error: (
+    background: map-get($color-palette-red, background, 200),
+    foreground: map-get($color-palette-red, background, 600),
+    text: map-get($color-palette-red, background, 600),
+    icon: map-get($color-palette-red, background, 600),
+  ),
+  info: (
+    background: map-get($color-palette-steel, background, 200),
+    foreground: map-get($color-palette-steel, background, 700),
+  ),
+  warning: map-get($color-palette-orange, background, 600),
+  hover: $primary-hover-color,
+  text: $color-grey-900,
+  focus: $primary-hover-color,
+);
diff --git a/src/vue/design/_shake-effect.scss b/src/vue/design/_shake-effect.scss
new file mode 100644
index 00000000..59b525fb
--- /dev/null
+++ b/src/vue/design/_shake-effect.scss
@@ -0,0 +1,25 @@
+@mixin shake-effect() {
+ animation: shake 0.25s ease-in-out;
+
+        @keyframes shake {
+          0% {
+            transform: translateX(0);
+          }
+
+          25% {
+            transform: translateX(-0.313rem);
+          }
+
+          50% {
+            transform: translateX(0.313rem);
+          }
+
+          75% {
+            transform: translateX(-0.313rem);
+          }
+
+          100% {
+          transform: translateX(0);
+          }
+        }
+}
diff --git a/yarn.lock b/yarn.lock
index 6af393dd..f63b44ee 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3277,6 +3277,11 @@
     "@vue/compiler-dom" "3.3.4"
     "@vue/shared" "3.3.4"
 
+"@vue/devtools-api@^6.0.0-beta.15":
+  version "6.5.0"
+  resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.0.tgz"
+  integrity sha512-o9KfBeaBmCKl10usN4crU53fYtC1r7jJwdGKjPT24t348rHxgfpZ0xL3Xm/gLUYnc0oTp8LAmrxOeLyu6tbk2Q==
+
 "@vue/reactivity-transform@3.3.4":
   version "3.3.4"
   resolved "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.4.tgz"
@@ -12700,6 +12705,13 @@ vary@^1, vary@~1.1.2:
   resolved "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz"
   integrity sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==
 
+vee-validate@^4.5.8:
+  version "4.5.8"
+  resolved "https://registry.npmjs.org/vee-validate/-/vee-validate-4.5.8.tgz"
+  integrity sha512-XZx2J93rlET49CdIIoxG9R6wQNoT3RxUUw9ar3QbIhczpzbtlm4BQ+TpCA9DoYHKFlApcXnE28WU7m4quoPsCA==
+  dependencies:
+    "@vue/devtools-api" "^6.0.0-beta.15"
+
 void-elements@^3.1.0:
   version "3.1.0"
   resolved "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz"