diff --git a/CTFd/themes/admin/assets/js/components/configs/fields/Field.vue b/CTFd/themes/admin/assets/js/components/configs/fields/Field.vue
new file mode 100644
index 00000000..af3b870e
--- /dev/null
+++ b/CTFd/themes/admin/assets/js/components/configs/fields/Field.vue
@@ -0,0 +1,102 @@
+<template>
+  <div class="border-bottom">
+
+    <div>
+      <button
+        type="button"
+        class="close float-right"
+        aria-label="Close"
+        @click="deleteField()"
+      >
+        <span aria-hidden="true">&times;</span>
+      </button>
+    </div>
+
+    <div class="row">
+      <div class="col-md-3">
+        <div class="form-group">
+          <label>Field Type</label>
+          <select class="form-control custom-select">
+            <option>Text Field</option>
+            <option>Checkbox</option>
+          </select>
+          <small class="form-text text-muted">Type of field shown to the user</small>
+        </div>
+      </div>
+      <div class="col-md-9">
+        <div class="form-group">
+          <label>Field Name</label>
+          <input type="text" class="form-control" v-model.lazy="field.name">
+          <small class="form-text text-muted">Field name</small>
+        </div>
+      </div>
+
+      <div class="col-md-12">
+        <div class="form-group">
+          <label>Field Description</label>
+          <input type="text" class="form-control" v-model.lazy="field.description">
+          <small id="emailHelp" class="form-text text-muted">Field Description</small>
+        </div>
+      </div>
+
+      <div class="col-md-12">
+        <div class="form-check">
+          <label class="form-check-label">
+              <input class="form-check-input" type="checkbox" v-model.lazy="field.editable"> Editable by user in profile
+          </label>
+        </div>
+        <div class="form-check">
+          <label class="form-check-label">
+            <input class="form-check-input" type="checkbox" v-model.lazy="field.required"> Required on registration
+          </label>
+        </div>
+        <div class="form-check">
+          <label class="form-check-label">
+            <input class="form-check-input" type="checkbox" v-model.lazy="field.public"> Shown on public profile
+          </label>
+        </div>
+      </div>
+    </div>
+
+    <div class="row pb-3">
+      <div class="col-md-12">
+        <div class="d-block">
+          <button
+            class="btn btn-sm btn-success btn-outlined float-right"
+            type="button"
+            @click="saveField()"
+          >
+            Save
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    index: Number,
+    initialField: Object
+  },
+  data: function() {
+    return {
+      field: this.initialField
+    }
+  },
+  methods: {
+    saveField: function(){
+      console.log(this.field)
+      // Update field in API
+    },
+    deleteField: function() {
+      // Delete field in API
+      this.$emit('delete-field', this.index);
+    },
+  }
+}
+</script>
+
+<style scoped>
+</style>
\ No newline at end of file
diff --git a/CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue b/CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue
new file mode 100644
index 00000000..5bd62956
--- /dev/null
+++ b/CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue
@@ -0,0 +1,69 @@
+<template>
+  <div>
+    <!-- You can't use index as :key here b/c Vue is crazy -->
+    <!-- https://rimdev.io/the-v-for-key/ -->
+    <div class="mb-5" v-for="(field, index) in fields" :key="field.id">
+      <Field
+        :index="index"
+        :initialField.sync="fields[index]"
+        @delete-field="deleteField"
+      />
+    </div>
+
+    <button
+      class="btn btn-sm btn-success btn-outlined float-right"
+      type="button"
+      @click="addField()"
+    >
+      Add New Field
+    </button>
+  </div>
+</template>
+
+<script>
+import Field from "./Field.vue";
+
+export default {
+  name: "FieldList",
+  components: {
+    Field
+  },
+  props: {},
+  data: function() {
+    return {
+      fields: []
+    };
+  },
+  methods: {
+    addField: function() {
+      this.fields.push({
+        id: `#${Math.random().toString(16).slice(2)}`,
+        name: "",
+        description: "",
+        editable: false,
+        required: false,
+        public: false
+      })
+      console.log(this.$data.fields)
+    },
+    deleteField: function(index) {
+      // if (fieldId) {
+        // Wait for API implementation
+      // }
+      // Remove field at index
+      this.fields.splice(index, 1);
+      console.log(this.fields)
+    }
+  },
+  created() {
+    this.fields.push({
+      id: 1,
+      name: "Name",
+      description: "Desc",
+      editable: true,
+      required: false,
+      public: true
+    });
+  }
+};
+</script>
diff --git a/CTFd/themes/admin/assets/js/pages/configs.js b/CTFd/themes/admin/assets/js/pages/configs.js
index c8b63177..6ff8aefb 100644
--- a/CTFd/themes/admin/assets/js/pages/configs.js
+++ b/CTFd/themes/admin/assets/js/pages/configs.js
@@ -9,6 +9,9 @@ import $ from "jquery";
 import { ezQuery, ezProgressBar, ezAlert } from "core/ezq";
 import CodeMirror from "codemirror";
 import "codemirror/mode/htmlmixed/htmlmixed.js";
+import Vue from "vue/dist/vue.esm.browser";
+import Field from "../components/configs/fields/Field.vue";
+import FieldList from "../components/configs/fields/FieldList.vue";
 
 function loadTimestamp(place, timestamp) {
   if (typeof timestamp == "string") {
@@ -360,4 +363,10 @@ $(() => {
       $("#mail_username_password").toggle(this.checked);
     })
     .change();
+
+  // Insert CommentBox element
+  const fieldList = Vue.extend(FieldList);
+  let vueContainer = document.createElement("div");
+  document.querySelector("#user-field-list").appendChild(vueContainer);
+  new fieldList({}).$mount(vueContainer);
 });
diff --git a/CTFd/themes/admin/static/js/components.dev.js b/CTFd/themes/admin/static/js/components.dev.js
index 0fe0cca2..a3671c89 100644
--- a/CTFd/themes/admin/static/js/components.dev.js
+++ b/CTFd/themes/admin/static/js/components.dev.js
@@ -48,6 +48,78 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _nod
 
 /***/ }),
 
+/***/ "./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue":
+/*!*************************************************************************!*\
+  !*** ./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue ***!
+  \*************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _Field_vue_vue_type_template_id_30e0f744_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Field.vue?vue&type=template&id=30e0f744&scoped=true& */ \"./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=template&id=30e0f744&scoped=true&\");\n/* harmony import */ var _Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Field.vue?vue&type=script&lang=js& */ \"./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=script&lang=js&\");\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ \"./node_modules/vue-loader/lib/runtime/componentNormalizer.js\");\n\n\n\n\n\n/* normalize component */\n\nvar component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(\n  _Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n  _Field_vue_vue_type_template_id_30e0f744_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"render\"],\n  _Field_vue_vue_type_template_id_30e0f744_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"],\n  false,\n  null,\n  \"30e0f744\",\n  null\n  \n)\n\n/* hot reload */\nif (false) { var api; }\ncomponent.options.__file = \"CTFd/themes/admin/assets/js/components/configs/fields/Field.vue\"\n/* harmony default export */ __webpack_exports__[\"default\"] = (component.exports);\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?");
+
+/***/ }),
+
+/***/ "./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=script&lang=js&":
+/*!**************************************************************************************************!*\
+  !*** ./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=script&lang=js& ***!
+  \**************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../../node_modules/babel-loader/lib??ref--0!../../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Field.vue?vue&type=script&lang=js& */ \"./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=script&lang=js&\");\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n /* harmony default export */ __webpack_exports__[\"default\"] = (_node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a); \n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?");
+
+/***/ }),
+
+/***/ "./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=template&id=30e0f744&scoped=true&":
+/*!********************************************************************************************************************!*\
+  !*** ./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=template&id=30e0f744&scoped=true& ***!
+  \********************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_template_id_30e0f744_scoped_true___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./Field.vue?vue&type=template&id=30e0f744&scoped=true& */ \"./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=template&id=30e0f744&scoped=true&\");\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_template_id_30e0f744_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"render\"]; });\n\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_Field_vue_vue_type_template_id_30e0f744_scoped_true___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"]; });\n\n\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?");
+
+/***/ }),
+
+/***/ "./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue":
+/*!*****************************************************************************!*\
+  !*** ./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue ***!
+  \*****************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _FieldList_vue_vue_type_template_id_4b8cc71c___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./FieldList.vue?vue&type=template&id=4b8cc71c& */ \"./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=template&id=4b8cc71c&\");\n/* harmony import */ var _FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./FieldList.vue?vue&type=script&lang=js& */ \"./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=script&lang=js&\");\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ \"./node_modules/vue-loader/lib/runtime/componentNormalizer.js\");\n\n\n\n\n\n/* normalize component */\n\nvar component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__[\"default\"])(\n  _FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__[\"default\"],\n  _FieldList_vue_vue_type_template_id_4b8cc71c___WEBPACK_IMPORTED_MODULE_0__[\"render\"],\n  _FieldList_vue_vue_type_template_id_4b8cc71c___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"],\n  false,\n  null,\n  null,\n  null\n  \n)\n\n/* hot reload */\nif (false) { var api; }\ncomponent.options.__file = \"CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue\"\n/* harmony default export */ __webpack_exports__[\"default\"] = (component.exports);\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?");
+
+/***/ }),
+
+/***/ "./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=script&lang=js&":
+/*!******************************************************************************************************!*\
+  !*** ./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=script&lang=js& ***!
+  \******************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../../node_modules/babel-loader/lib??ref--0!../../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./FieldList.vue?vue&type=script&lang=js& */ \"./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=script&lang=js&\");\n/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__);\n/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__) if(__WEBPACK_IMPORT_KEY__ !== 'default') (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));\n /* harmony default export */ __webpack_exports__[\"default\"] = (_node_modules_babel_loader_lib_index_js_ref_0_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0___default.a); \n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?");
+
+/***/ }),
+
+/***/ "./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=template&id=4b8cc71c&":
+/*!************************************************************************************************************!*\
+  !*** ./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=template&id=4b8cc71c& ***!
+  \************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_template_id_4b8cc71c___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../../../../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../../../node_modules/vue-loader/lib??vue-loader-options!./FieldList.vue?vue&type=template&id=4b8cc71c& */ \"./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=template&id=4b8cc71c&\");\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_template_id_4b8cc71c___WEBPACK_IMPORTED_MODULE_0__[\"render\"]; });\n\n/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_FieldList_vue_vue_type_template_id_4b8cc71c___WEBPACK_IMPORTED_MODULE_0__[\"staticRenderFns\"]; });\n\n\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?");
+
+/***/ }),
+
 /***/ "./CTFd/themes/admin/assets/js/components/files/MediaLibrary.vue":
 /*!***********************************************************************!*\
   !*** ./CTFd/themes/admin/assets/js/components/files/MediaLibrary.vue ***!
@@ -96,6 +168,30 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\n
 
 /***/ }),
 
+/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=script&lang=js&":
+/*!********************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib??ref--0!./node_modules/vue-loader/lib??vue-loader-options!./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=script&lang=js& ***!
+  \********************************************************************************************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+;
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n  props: {\n    index: Number,\n    initialField: Object\n  },\n  data: function data() {\n    return {\n      field: this.initialField\n    };\n  },\n  methods: {\n    saveField: function saveField() {\n      console.log(this.field); // Update field in API\n    },\n    deleteField: function deleteField() {\n      // Delete field in API\n      this.$emit('delete-field', this.index);\n    }\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?./node_modules/babel-loader/lib??ref--0!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=script&lang=js&":
+/*!************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/babel-loader/lib??ref--0!./node_modules/vue-loader/lib??vue-loader-options!./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=script&lang=js& ***!
+  \************************************************************************************************************************************************************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+;
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\nvar _Field = _interopRequireDefault(__webpack_require__(/*! ./Field.vue */ \"./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n  name: \"FieldList\",\n  components: {\n    Field: _Field.default\n  },\n  props: {},\n  data: function data() {\n    return {\n      fields: []\n    };\n  },\n  methods: {\n    addField: function addField() {\n      this.fields.push({\n        id: \"#\".concat(Math.random().toString(16).slice(2)),\n        name: \"\",\n        description: \"\",\n        editable: false,\n        required: false,\n        public: false\n      });\n      console.log(this.$data.fields);\n    },\n    deleteField: function deleteField(index) {\n      // if (fieldId) {\n      // Wait for API implementation\n      // }\n      // Remove field at index\n      this.fields.splice(index, 1);\n      console.log(this.fields);\n    }\n  },\n  created: function created() {\n    this.fields.push({\n      id: 1,\n      name: \"Name\",\n      description: \"Desc\",\n      editable: true,\n      required: false,\n      public: true\n    });\n  }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?./node_modules/babel-loader/lib??ref--0!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
 /***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/files/MediaLibrary.vue?vue&type=script&lang=js&":
 /*!******************************************************************************************************************************************************************************************!*\
   !*** ./node_modules/babel-loader/lib??ref--0!./node_modules/vue-loader/lib??vue-loader-options!./CTFd/themes/admin/assets/js/components/files/MediaLibrary.vue?vue&type=script&lang=js& ***!
@@ -131,6 +227,30 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) *
 
 /***/ }),
 
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=template&id=30e0f744&scoped=true&":
+/*!**************************************************************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?vue&type=template&id=30e0f744&scoped=true& ***!
+  \**************************************************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", { staticClass: \"border-bottom\" }, [\n    _c(\"div\", [\n      _c(\n        \"button\",\n        {\n          staticClass: \"close float-right\",\n          attrs: { type: \"button\", \"aria-label\": \"Close\" },\n          on: {\n            click: function($event) {\n              return _vm.deleteField()\n            }\n          }\n        },\n        [_c(\"span\", { attrs: { \"aria-hidden\": \"true\" } }, [_vm._v(\"×\")])]\n      )\n    ]),\n    _vm._v(\" \"),\n    _c(\"div\", { staticClass: \"row\" }, [\n      _vm._m(0),\n      _vm._v(\" \"),\n      _c(\"div\", { staticClass: \"col-md-9\" }, [\n        _c(\"div\", { staticClass: \"form-group\" }, [\n          _c(\"label\", [_vm._v(\"Field Name\")]),\n          _vm._v(\" \"),\n          _c(\"input\", {\n            directives: [\n              {\n                name: \"model\",\n                rawName: \"v-model.lazy\",\n                value: _vm.field.name,\n                expression: \"field.name\",\n                modifiers: { lazy: true }\n              }\n            ],\n            staticClass: \"form-control\",\n            attrs: { type: \"text\" },\n            domProps: { value: _vm.field.name },\n            on: {\n              change: function($event) {\n                return _vm.$set(_vm.field, \"name\", $event.target.value)\n              }\n            }\n          }),\n          _vm._v(\" \"),\n          _c(\"small\", { staticClass: \"form-text text-muted\" }, [\n            _vm._v(\"Field name\")\n          ])\n        ])\n      ]),\n      _vm._v(\" \"),\n      _c(\"div\", { staticClass: \"col-md-12\" }, [\n        _c(\"div\", { staticClass: \"form-group\" }, [\n          _c(\"label\", [_vm._v(\"Field Description\")]),\n          _vm._v(\" \"),\n          _c(\"input\", {\n            directives: [\n              {\n                name: \"model\",\n                rawName: \"v-model.lazy\",\n                value: _vm.field.description,\n                expression: \"field.description\",\n                modifiers: { lazy: true }\n              }\n            ],\n            staticClass: \"form-control\",\n            attrs: { type: \"text\" },\n            domProps: { value: _vm.field.description },\n            on: {\n              change: function($event) {\n                return _vm.$set(_vm.field, \"description\", $event.target.value)\n              }\n            }\n          }),\n          _vm._v(\" \"),\n          _c(\n            \"small\",\n            { staticClass: \"form-text text-muted\", attrs: { id: \"emailHelp\" } },\n            [_vm._v(\"Field Description\")]\n          )\n        ])\n      ]),\n      _vm._v(\" \"),\n      _c(\"div\", { staticClass: \"col-md-12\" }, [\n        _c(\"div\", { staticClass: \"form-check\" }, [\n          _c(\"label\", { staticClass: \"form-check-label\" }, [\n            _c(\"input\", {\n              directives: [\n                {\n                  name: \"model\",\n                  rawName: \"v-model.lazy\",\n                  value: _vm.field.editable,\n                  expression: \"field.editable\",\n                  modifiers: { lazy: true }\n                }\n              ],\n              staticClass: \"form-check-input\",\n              attrs: { type: \"checkbox\" },\n              domProps: {\n                checked: Array.isArray(_vm.field.editable)\n                  ? _vm._i(_vm.field.editable, null) > -1\n                  : _vm.field.editable\n              },\n              on: {\n                change: function($event) {\n                  var $$a = _vm.field.editable,\n                    $$el = $event.target,\n                    $$c = $$el.checked ? true : false\n                  if (Array.isArray($$a)) {\n                    var $$v = null,\n                      $$i = _vm._i($$a, $$v)\n                    if ($$el.checked) {\n                      $$i < 0 &&\n                        _vm.$set(_vm.field, \"editable\", $$a.concat([$$v]))\n                    } else {\n                      $$i > -1 &&\n                        _vm.$set(\n                          _vm.field,\n                          \"editable\",\n                          $$a.slice(0, $$i).concat($$a.slice($$i + 1))\n                        )\n                    }\n                  } else {\n                    _vm.$set(_vm.field, \"editable\", $$c)\n                  }\n                }\n              }\n            }),\n            _vm._v(\" Editable by user in profile\\n        \")\n          ])\n        ]),\n        _vm._v(\" \"),\n        _c(\"div\", { staticClass: \"form-check\" }, [\n          _c(\"label\", { staticClass: \"form-check-label\" }, [\n            _c(\"input\", {\n              directives: [\n                {\n                  name: \"model\",\n                  rawName: \"v-model.lazy\",\n                  value: _vm.field.required,\n                  expression: \"field.required\",\n                  modifiers: { lazy: true }\n                }\n              ],\n              staticClass: \"form-check-input\",\n              attrs: { type: \"checkbox\" },\n              domProps: {\n                checked: Array.isArray(_vm.field.required)\n                  ? _vm._i(_vm.field.required, null) > -1\n                  : _vm.field.required\n              },\n              on: {\n                change: function($event) {\n                  var $$a = _vm.field.required,\n                    $$el = $event.target,\n                    $$c = $$el.checked ? true : false\n                  if (Array.isArray($$a)) {\n                    var $$v = null,\n                      $$i = _vm._i($$a, $$v)\n                    if ($$el.checked) {\n                      $$i < 0 &&\n                        _vm.$set(_vm.field, \"required\", $$a.concat([$$v]))\n                    } else {\n                      $$i > -1 &&\n                        _vm.$set(\n                          _vm.field,\n                          \"required\",\n                          $$a.slice(0, $$i).concat($$a.slice($$i + 1))\n                        )\n                    }\n                  } else {\n                    _vm.$set(_vm.field, \"required\", $$c)\n                  }\n                }\n              }\n            }),\n            _vm._v(\" Required on registration\\n        \")\n          ])\n        ]),\n        _vm._v(\" \"),\n        _c(\"div\", { staticClass: \"form-check\" }, [\n          _c(\"label\", { staticClass: \"form-check-label\" }, [\n            _c(\"input\", {\n              directives: [\n                {\n                  name: \"model\",\n                  rawName: \"v-model.lazy\",\n                  value: _vm.field.public,\n                  expression: \"field.public\",\n                  modifiers: { lazy: true }\n                }\n              ],\n              staticClass: \"form-check-input\",\n              attrs: { type: \"checkbox\" },\n              domProps: {\n                checked: Array.isArray(_vm.field.public)\n                  ? _vm._i(_vm.field.public, null) > -1\n                  : _vm.field.public\n              },\n              on: {\n                change: function($event) {\n                  var $$a = _vm.field.public,\n                    $$el = $event.target,\n                    $$c = $$el.checked ? true : false\n                  if (Array.isArray($$a)) {\n                    var $$v = null,\n                      $$i = _vm._i($$a, $$v)\n                    if ($$el.checked) {\n                      $$i < 0 &&\n                        _vm.$set(_vm.field, \"public\", $$a.concat([$$v]))\n                    } else {\n                      $$i > -1 &&\n                        _vm.$set(\n                          _vm.field,\n                          \"public\",\n                          $$a.slice(0, $$i).concat($$a.slice($$i + 1))\n                        )\n                    }\n                  } else {\n                    _vm.$set(_vm.field, \"public\", $$c)\n                  }\n                }\n              }\n            }),\n            _vm._v(\" Shown on public profile\\n        \")\n          ])\n        ])\n      ])\n    ]),\n    _vm._v(\" \"),\n    _c(\"div\", { staticClass: \"row pb-3\" }, [\n      _c(\"div\", { staticClass: \"col-md-12\" }, [\n        _c(\"div\", { staticClass: \"d-block\" }, [\n          _c(\n            \"button\",\n            {\n              staticClass: \"btn btn-sm btn-success btn-outlined float-right\",\n              attrs: { type: \"button\" },\n              on: {\n                click: function($event) {\n                  return _vm.saveField()\n                }\n              }\n            },\n            [_vm._v(\"\\n          Save\\n        \")]\n          )\n        ])\n      ])\n    ])\n  ])\n}\nvar staticRenderFns = [\n  function() {\n    var _vm = this\n    var _h = _vm.$createElement\n    var _c = _vm._self._c || _h\n    return _c(\"div\", { staticClass: \"col-md-3\" }, [\n      _c(\"div\", { staticClass: \"form-group\" }, [\n        _c(\"label\", [_vm._v(\"Field Type\")]),\n        _vm._v(\" \"),\n        _c(\"select\", { staticClass: \"form-control custom-select\" }, [\n          _c(\"option\", [_vm._v(\"Text Field\")]),\n          _vm._v(\" \"),\n          _c(\"option\", [_vm._v(\"Checkbox\")])\n        ]),\n        _vm._v(\" \"),\n        _c(\"small\", { staticClass: \"form-text text-muted\" }, [\n          _vm._v(\"Type of field shown to the user\")\n        ])\n      ])\n    ])\n  }\n]\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=template&id=4b8cc71c&":
+/*!******************************************************************************************************************************************************************************************************************************************!*\
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?vue&type=template&id=4b8cc71c& ***!
+  \******************************************************************************************************************************************************************************************************************************************/
+/*! exports provided: render, staticRenderFns */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+;
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"div\",\n    [\n      _vm._l(_vm.fields, function(field, index) {\n        return _c(\n          \"div\",\n          { key: field.id, staticClass: \"mb-5\" },\n          [\n            _c(\"Field\", {\n              attrs: { index: index, initialField: _vm.fields[index] },\n              on: {\n                \"update:initialField\": function($event) {\n                  return _vm.$set(_vm.fields, index, $event)\n                },\n                \"update:initial-field\": function($event) {\n                  return _vm.$set(_vm.fields, index, $event)\n                },\n                \"delete-field\": _vm.deleteField\n              }\n            })\n          ],\n          1\n        )\n      }),\n      _vm._v(\" \"),\n      _c(\n        \"button\",\n        {\n          staticClass: \"btn btn-sm btn-success btn-outlined float-right\",\n          attrs: { type: \"button\" },\n          on: {\n            click: function($event) {\n              return _vm.addField()\n            }\n          }\n        },\n        [_vm._v(\"\\n    Add New Field\\n  \")]\n      )\n    ],\n    2\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options");
+
+/***/ }),
+
 /***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./CTFd/themes/admin/assets/js/components/files/MediaLibrary.vue?vue&type=template&id=50f8d42a&":
 /*!************************************************************************************************************************************************************************************************************************************!*\
   !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./CTFd/themes/admin/assets/js/components/files/MediaLibrary.vue?vue&type=template&id=50f8d42a& ***!
diff --git a/CTFd/themes/admin/static/js/pages/configs.dev.js b/CTFd/themes/admin/static/js/pages/configs.dev.js
index 3ef01766..b516f369 100644
--- a/CTFd/themes/admin/static/js/pages/configs.dev.js
+++ b/CTFd/themes/admin/static/js/pages/configs.dev.js
@@ -162,7 +162,7 @@
 /***/ (function(module, exports, __webpack_require__) {
 
 ;
-eval("\n\n__webpack_require__(/*! ./main */ \"./CTFd/themes/admin/assets/js/pages/main.js\");\n\n__webpack_require__(/*! core/utils */ \"./CTFd/themes/core/assets/js/utils.js\");\n\n__webpack_require__(/*! bootstrap/js/dist/tab */ \"./node_modules/bootstrap/js/dist/tab.js\");\n\nvar _momentTimezone = _interopRequireDefault(__webpack_require__(/*! moment-timezone */ \"./node_modules/moment-timezone/index.js\"));\n\nvar _CTFd = _interopRequireDefault(__webpack_require__(/*! core/CTFd */ \"./CTFd/themes/core/assets/js/CTFd.js\"));\n\nvar _helpers = _interopRequireDefault(__webpack_require__(/*! core/helpers */ \"./CTFd/themes/core/assets/js/helpers.js\"));\n\nvar _jquery = _interopRequireDefault(__webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\"));\n\nvar _ezq = __webpack_require__(/*! core/ezq */ \"./CTFd/themes/core/assets/js/ezq.js\");\n\nvar _codemirror = _interopRequireDefault(__webpack_require__(/*! codemirror */ \"./node_modules/codemirror/lib/codemirror.js\"));\n\n__webpack_require__(/*! codemirror/mode/htmlmixed/htmlmixed.js */ \"./node_modules/codemirror/mode/htmlmixed/htmlmixed.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction loadTimestamp(place, timestamp) {\n  if (typeof timestamp == \"string\") {\n    timestamp = parseInt(timestamp, 10);\n  }\n\n  var m = (0, _momentTimezone.default)(timestamp * 1000);\n  (0, _jquery.default)(\"#\" + place + \"-month\").val(m.month() + 1); // Months are zero indexed (http://momentjs.com/docs/#/get-set/month/)\n\n  (0, _jquery.default)(\"#\" + place + \"-day\").val(m.date());\n  (0, _jquery.default)(\"#\" + place + \"-year\").val(m.year());\n  (0, _jquery.default)(\"#\" + place + \"-hour\").val(m.hour());\n  (0, _jquery.default)(\"#\" + place + \"-minute\").val(m.minute());\n  loadDateValues(place);\n}\n\nfunction loadDateValues(place) {\n  var month = (0, _jquery.default)(\"#\" + place + \"-month\").val();\n  var day = (0, _jquery.default)(\"#\" + place + \"-day\").val();\n  var year = (0, _jquery.default)(\"#\" + place + \"-year\").val();\n  var hour = (0, _jquery.default)(\"#\" + place + \"-hour\").val();\n  var minute = (0, _jquery.default)(\"#\" + place + \"-minute\").val();\n  var timezone = (0, _jquery.default)(\"#\" + place + \"-timezone\").val();\n  var utc = convertDateToMoment(month, day, year, hour, minute);\n\n  if (isNaN(utc.unix())) {\n    (0, _jquery.default)(\"#\" + place).val(\"\");\n    (0, _jquery.default)(\"#\" + place + \"-local\").val(\"\");\n    (0, _jquery.default)(\"#\" + place + \"-zonetime\").val(\"\");\n  } else {\n    (0, _jquery.default)(\"#\" + place).val(utc.unix());\n    (0, _jquery.default)(\"#\" + place + \"-local\").val(utc.local().format(\"dddd, MMMM Do YYYY, h:mm:ss a zz\"));\n    (0, _jquery.default)(\"#\" + place + \"-zonetime\").val(utc.tz(timezone).format(\"dddd, MMMM Do YYYY, h:mm:ss a zz\"));\n  }\n}\n\nfunction convertDateToMoment(month, day, year, hour, minute) {\n  var month_num = month.toString();\n\n  if (month_num.length == 1) {\n    month_num = \"0\" + month_num;\n  }\n\n  var day_str = day.toString();\n\n  if (day_str.length == 1) {\n    day_str = \"0\" + day_str;\n  }\n\n  var hour_str = hour.toString();\n\n  if (hour_str.length == 1) {\n    hour_str = \"0\" + hour_str;\n  }\n\n  var min_str = minute.toString();\n\n  if (min_str.length == 1) {\n    min_str = \"0\" + min_str;\n  } // 2013-02-08 24:00\n\n\n  var date_string = year.toString() + \"-\" + month_num + \"-\" + day_str + \" \" + hour_str + \":\" + min_str + \":00\";\n  return (0, _momentTimezone.default)(date_string, _momentTimezone.default.ISO_8601);\n}\n\nfunction updateConfigs(event) {\n  event.preventDefault();\n  var obj = (0, _jquery.default)(this).serializeJSON();\n  var params = {};\n\n  if (obj.mail_useauth === false) {\n    obj.mail_username = null;\n    obj.mail_password = null;\n  } else {\n    if (obj.mail_username === \"\") {\n      delete obj.mail_username;\n    }\n\n    if (obj.mail_password === \"\") {\n      delete obj.mail_password;\n    }\n  }\n\n  Object.keys(obj).forEach(function (x) {\n    if (obj[x] === \"true\") {\n      params[x] = true;\n    } else if (obj[x] === \"false\") {\n      params[x] = false;\n    } else {\n      params[x] = obj[x];\n    }\n  });\n\n  _CTFd.default.api.patch_config_list({}, params).then(function (_response) {\n    window.location.reload();\n  });\n}\n\nfunction uploadLogo(event) {\n  event.preventDefault();\n  var form = event.target;\n\n  _helpers.default.files.upload(form, {}, function (response) {\n    var f = response.data[0];\n    var params = {\n      value: f.location\n    };\n\n    _CTFd.default.fetch(\"/api/v1/configs/ctf_logo\", {\n      method: \"PATCH\",\n      body: JSON.stringify(params)\n    }).then(function (response) {\n      return response.json();\n    }).then(function (response) {\n      if (response.success) {\n        window.location.reload();\n      } else {\n        (0, _ezq.ezAlert)({\n          title: \"Error!\",\n          body: \"Logo uploading failed!\",\n          button: \"Okay\"\n        });\n      }\n    });\n  });\n}\n\nfunction removeLogo() {\n  (0, _ezq.ezQuery)({\n    title: \"Remove logo\",\n    body: \"Are you sure you'd like to remove the CTF logo?\",\n    success: function success() {\n      var params = {\n        value: null\n      };\n\n      _CTFd.default.api.patch_config({\n        configKey: \"ctf_logo\"\n      }, params).then(function (_response) {\n        window.location.reload();\n      });\n    }\n  });\n}\n\nfunction importConfig(event) {\n  event.preventDefault();\n  var import_file = document.getElementById(\"import-file\").files[0];\n  var form_data = new FormData();\n  form_data.append(\"backup\", import_file);\n  form_data.append(\"nonce\", _CTFd.default.config.csrfNonce);\n  var pg = (0, _ezq.ezProgressBar)({\n    width: 0,\n    title: \"Upload Progress\"\n  });\n\n  _jquery.default.ajax({\n    url: _CTFd.default.config.urlRoot + \"/admin/import\",\n    type: \"POST\",\n    data: form_data,\n    processData: false,\n    contentType: false,\n    statusCode: {\n      500: function _(resp) {\n        alert(resp.responseText);\n      }\n    },\n    xhr: function xhr() {\n      var xhr = _jquery.default.ajaxSettings.xhr();\n\n      xhr.upload.onprogress = function (e) {\n        if (e.lengthComputable) {\n          var width = e.loaded / e.total * 100;\n          pg = (0, _ezq.ezProgressBar)({\n            target: pg,\n            width: width\n          });\n        }\n      };\n\n      return xhr;\n    },\n    success: function success(_data) {\n      pg = (0, _ezq.ezProgressBar)({\n        target: pg,\n        width: 100\n      });\n      setTimeout(function () {\n        pg.modal(\"hide\");\n      }, 500);\n      setTimeout(function () {\n        window.location.reload();\n      }, 700);\n    }\n  });\n}\n\nfunction exportConfig(event) {\n  event.preventDefault();\n  window.location.href = (0, _jquery.default)(this).attr(\"href\");\n}\n\nfunction insertTimezones(target) {\n  var current = (0, _jquery.default)(\"<option>\").text(_momentTimezone.default.tz.guess());\n  (0, _jquery.default)(target).append(current);\n\n  var tz_names = _momentTimezone.default.tz.names();\n\n  for (var i = 0; i < tz_names.length; i++) {\n    var tz = (0, _jquery.default)(\"<option>\").text(tz_names[i]);\n    (0, _jquery.default)(target).append(tz);\n  }\n}\n\n(0, _jquery.default)(function () {\n  var theme_header_editor = _codemirror.default.fromTextArea(document.getElementById(\"theme-header\"), {\n    lineNumbers: true,\n    lineWrapping: true,\n    mode: \"htmlmixed\",\n    htmlMode: true\n  });\n\n  var theme_footer_editor = _codemirror.default.fromTextArea(document.getElementById(\"theme-footer\"), {\n    lineNumbers: true,\n    lineWrapping: true,\n    mode: \"htmlmixed\",\n    htmlMode: true\n  });\n\n  var theme_settings_editor = _codemirror.default.fromTextArea(document.getElementById(\"theme-settings\"), {\n    lineNumbers: true,\n    lineWrapping: true,\n    mode: {\n      name: \"javascript\",\n      json: true\n    }\n  }); // Handle refreshing codemirror when switching tabs.\n  // Better than the autorefresh approach b/c there's no flicker\n\n\n  (0, _jquery.default)(\"a[href='#theme']\").on(\"shown.bs.tab\", function (_e) {\n    theme_header_editor.refresh();\n    theme_footer_editor.refresh();\n    theme_settings_editor.refresh();\n  });\n  (0, _jquery.default)(\"#theme-settings-modal form\").submit(function (e) {\n    e.preventDefault();\n    theme_settings_editor.getDoc().setValue(JSON.stringify((0, _jquery.default)(this).serializeJSON(), null, 2));\n    (0, _jquery.default)(\"#theme-settings-modal\").modal(\"hide\");\n  });\n  (0, _jquery.default)(\"#theme-settings-button\").click(function () {\n    var form = (0, _jquery.default)(\"#theme-settings-modal form\");\n    var data; // Ignore invalid JSON data\n\n    try {\n      data = JSON.parse(theme_settings_editor.getValue());\n    } catch (e) {\n      data = {};\n    }\n\n    _jquery.default.each(data, function (key, value) {\n      var ctrl = form.find(\"[name='\".concat(key, \"']\"));\n\n      switch (ctrl.prop(\"type\")) {\n        case \"radio\":\n        case \"checkbox\":\n          ctrl.each(function () {\n            if ((0, _jquery.default)(this).attr(\"value\") == value) {\n              (0, _jquery.default)(this).attr(\"checked\", value);\n            }\n          });\n          break;\n\n        default:\n          ctrl.val(value);\n      }\n    });\n\n    (0, _jquery.default)(\"#theme-settings-modal\").modal();\n  });\n  insertTimezones((0, _jquery.default)(\"#start-timezone\"));\n  insertTimezones((0, _jquery.default)(\"#end-timezone\"));\n  insertTimezones((0, _jquery.default)(\"#freeze-timezone\"));\n  (0, _jquery.default)(\".config-section > form:not(.form-upload)\").submit(updateConfigs);\n  (0, _jquery.default)(\"#logo-upload\").submit(uploadLogo);\n  (0, _jquery.default)(\"#remove-logo\").click(removeLogo);\n  (0, _jquery.default)(\"#export-button\").click(exportConfig);\n  (0, _jquery.default)(\"#import-button\").click(importConfig);\n  (0, _jquery.default)(\"#config-color-update\").click(function () {\n    var hex_code = (0, _jquery.default)(\"#config-color-picker\").val();\n    var user_css = theme_header_editor.getValue();\n    var new_css;\n\n    if (user_css.length) {\n      var css_vars = \"theme-color: \".concat(hex_code, \";\");\n      new_css = user_css.replace(/theme-color: (.*);/, css_vars);\n    } else {\n      new_css = \"<style id=\\\"theme-color\\\">\\n\" + \":root {--theme-color: \".concat(hex_code, \";}\\n\") + \".navbar{background-color: var(--theme-color) !important;}\\n\" + \".jumbotron{background-color: var(--theme-color) !important;}\\n\" + \"</style>\\n\";\n    }\n\n    theme_header_editor.getDoc().setValue(new_css);\n  });\n  (0, _jquery.default)(\".start-date\").change(function () {\n    loadDateValues(\"start\");\n  });\n  (0, _jquery.default)(\".end-date\").change(function () {\n    loadDateValues(\"end\");\n  });\n  (0, _jquery.default)(\".freeze-date\").change(function () {\n    loadDateValues(\"freeze\");\n  });\n  var start = (0, _jquery.default)(\"#start\").val();\n  var end = (0, _jquery.default)(\"#end\").val();\n  var freeze = (0, _jquery.default)(\"#freeze\").val();\n\n  if (start) {\n    loadTimestamp(\"start\", start);\n  }\n\n  if (end) {\n    loadTimestamp(\"end\", end);\n  }\n\n  if (freeze) {\n    loadTimestamp(\"freeze\", freeze);\n  } // Toggle username and password based on stored value\n\n\n  (0, _jquery.default)(\"#mail_useauth\").change(function () {\n    (0, _jquery.default)(\"#mail_username_password\").toggle(this.checked);\n  }).change();\n});\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/pages/configs.js?");
+eval("\n\n__webpack_require__(/*! ./main */ \"./CTFd/themes/admin/assets/js/pages/main.js\");\n\n__webpack_require__(/*! core/utils */ \"./CTFd/themes/core/assets/js/utils.js\");\n\n__webpack_require__(/*! bootstrap/js/dist/tab */ \"./node_modules/bootstrap/js/dist/tab.js\");\n\nvar _momentTimezone = _interopRequireDefault(__webpack_require__(/*! moment-timezone */ \"./node_modules/moment-timezone/index.js\"));\n\nvar _CTFd = _interopRequireDefault(__webpack_require__(/*! core/CTFd */ \"./CTFd/themes/core/assets/js/CTFd.js\"));\n\nvar _helpers = _interopRequireDefault(__webpack_require__(/*! core/helpers */ \"./CTFd/themes/core/assets/js/helpers.js\"));\n\nvar _jquery = _interopRequireDefault(__webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\"));\n\nvar _ezq = __webpack_require__(/*! core/ezq */ \"./CTFd/themes/core/assets/js/ezq.js\");\n\nvar _codemirror = _interopRequireDefault(__webpack_require__(/*! codemirror */ \"./node_modules/codemirror/lib/codemirror.js\"));\n\n__webpack_require__(/*! codemirror/mode/htmlmixed/htmlmixed.js */ \"./node_modules/codemirror/mode/htmlmixed/htmlmixed.js\");\n\nvar _vueEsm = _interopRequireDefault(__webpack_require__(/*! vue/dist/vue.esm.browser */ \"./node_modules/vue/dist/vue.esm.browser.js\"));\n\nvar _Field = _interopRequireDefault(__webpack_require__(/*! ../components/configs/fields/Field.vue */ \"./CTFd/themes/admin/assets/js/components/configs/fields/Field.vue\"));\n\nvar _FieldList = _interopRequireDefault(__webpack_require__(/*! ../components/configs/fields/FieldList.vue */ \"./CTFd/themes/admin/assets/js/components/configs/fields/FieldList.vue\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction loadTimestamp(place, timestamp) {\n  if (typeof timestamp == \"string\") {\n    timestamp = parseInt(timestamp, 10);\n  }\n\n  var m = (0, _momentTimezone.default)(timestamp * 1000);\n  (0, _jquery.default)(\"#\" + place + \"-month\").val(m.month() + 1); // Months are zero indexed (http://momentjs.com/docs/#/get-set/month/)\n\n  (0, _jquery.default)(\"#\" + place + \"-day\").val(m.date());\n  (0, _jquery.default)(\"#\" + place + \"-year\").val(m.year());\n  (0, _jquery.default)(\"#\" + place + \"-hour\").val(m.hour());\n  (0, _jquery.default)(\"#\" + place + \"-minute\").val(m.minute());\n  loadDateValues(place);\n}\n\nfunction loadDateValues(place) {\n  var month = (0, _jquery.default)(\"#\" + place + \"-month\").val();\n  var day = (0, _jquery.default)(\"#\" + place + \"-day\").val();\n  var year = (0, _jquery.default)(\"#\" + place + \"-year\").val();\n  var hour = (0, _jquery.default)(\"#\" + place + \"-hour\").val();\n  var minute = (0, _jquery.default)(\"#\" + place + \"-minute\").val();\n  var timezone = (0, _jquery.default)(\"#\" + place + \"-timezone\").val();\n  var utc = convertDateToMoment(month, day, year, hour, minute);\n\n  if (isNaN(utc.unix())) {\n    (0, _jquery.default)(\"#\" + place).val(\"\");\n    (0, _jquery.default)(\"#\" + place + \"-local\").val(\"\");\n    (0, _jquery.default)(\"#\" + place + \"-zonetime\").val(\"\");\n  } else {\n    (0, _jquery.default)(\"#\" + place).val(utc.unix());\n    (0, _jquery.default)(\"#\" + place + \"-local\").val(utc.local().format(\"dddd, MMMM Do YYYY, h:mm:ss a zz\"));\n    (0, _jquery.default)(\"#\" + place + \"-zonetime\").val(utc.tz(timezone).format(\"dddd, MMMM Do YYYY, h:mm:ss a zz\"));\n  }\n}\n\nfunction convertDateToMoment(month, day, year, hour, minute) {\n  var month_num = month.toString();\n\n  if (month_num.length == 1) {\n    month_num = \"0\" + month_num;\n  }\n\n  var day_str = day.toString();\n\n  if (day_str.length == 1) {\n    day_str = \"0\" + day_str;\n  }\n\n  var hour_str = hour.toString();\n\n  if (hour_str.length == 1) {\n    hour_str = \"0\" + hour_str;\n  }\n\n  var min_str = minute.toString();\n\n  if (min_str.length == 1) {\n    min_str = \"0\" + min_str;\n  } // 2013-02-08 24:00\n\n\n  var date_string = year.toString() + \"-\" + month_num + \"-\" + day_str + \" \" + hour_str + \":\" + min_str + \":00\";\n  return (0, _momentTimezone.default)(date_string, _momentTimezone.default.ISO_8601);\n}\n\nfunction updateConfigs(event) {\n  event.preventDefault();\n  var obj = (0, _jquery.default)(this).serializeJSON();\n  var params = {};\n\n  if (obj.mail_useauth === false) {\n    obj.mail_username = null;\n    obj.mail_password = null;\n  } else {\n    if (obj.mail_username === \"\") {\n      delete obj.mail_username;\n    }\n\n    if (obj.mail_password === \"\") {\n      delete obj.mail_password;\n    }\n  }\n\n  Object.keys(obj).forEach(function (x) {\n    if (obj[x] === \"true\") {\n      params[x] = true;\n    } else if (obj[x] === \"false\") {\n      params[x] = false;\n    } else {\n      params[x] = obj[x];\n    }\n  });\n\n  _CTFd.default.api.patch_config_list({}, params).then(function (_response) {\n    window.location.reload();\n  });\n}\n\nfunction uploadLogo(event) {\n  event.preventDefault();\n  var form = event.target;\n\n  _helpers.default.files.upload(form, {}, function (response) {\n    var f = response.data[0];\n    var params = {\n      value: f.location\n    };\n\n    _CTFd.default.fetch(\"/api/v1/configs/ctf_logo\", {\n      method: \"PATCH\",\n      body: JSON.stringify(params)\n    }).then(function (response) {\n      return response.json();\n    }).then(function (response) {\n      if (response.success) {\n        window.location.reload();\n      } else {\n        (0, _ezq.ezAlert)({\n          title: \"Error!\",\n          body: \"Logo uploading failed!\",\n          button: \"Okay\"\n        });\n      }\n    });\n  });\n}\n\nfunction removeLogo() {\n  (0, _ezq.ezQuery)({\n    title: \"Remove logo\",\n    body: \"Are you sure you'd like to remove the CTF logo?\",\n    success: function success() {\n      var params = {\n        value: null\n      };\n\n      _CTFd.default.api.patch_config({\n        configKey: \"ctf_logo\"\n      }, params).then(function (_response) {\n        window.location.reload();\n      });\n    }\n  });\n}\n\nfunction importConfig(event) {\n  event.preventDefault();\n  var import_file = document.getElementById(\"import-file\").files[0];\n  var form_data = new FormData();\n  form_data.append(\"backup\", import_file);\n  form_data.append(\"nonce\", _CTFd.default.config.csrfNonce);\n  var pg = (0, _ezq.ezProgressBar)({\n    width: 0,\n    title: \"Upload Progress\"\n  });\n\n  _jquery.default.ajax({\n    url: _CTFd.default.config.urlRoot + \"/admin/import\",\n    type: \"POST\",\n    data: form_data,\n    processData: false,\n    contentType: false,\n    statusCode: {\n      500: function _(resp) {\n        alert(resp.responseText);\n      }\n    },\n    xhr: function xhr() {\n      var xhr = _jquery.default.ajaxSettings.xhr();\n\n      xhr.upload.onprogress = function (e) {\n        if (e.lengthComputable) {\n          var width = e.loaded / e.total * 100;\n          pg = (0, _ezq.ezProgressBar)({\n            target: pg,\n            width: width\n          });\n        }\n      };\n\n      return xhr;\n    },\n    success: function success(_data) {\n      pg = (0, _ezq.ezProgressBar)({\n        target: pg,\n        width: 100\n      });\n      setTimeout(function () {\n        pg.modal(\"hide\");\n      }, 500);\n      setTimeout(function () {\n        window.location.reload();\n      }, 700);\n    }\n  });\n}\n\nfunction exportConfig(event) {\n  event.preventDefault();\n  window.location.href = (0, _jquery.default)(this).attr(\"href\");\n}\n\nfunction insertTimezones(target) {\n  var current = (0, _jquery.default)(\"<option>\").text(_momentTimezone.default.tz.guess());\n  (0, _jquery.default)(target).append(current);\n\n  var tz_names = _momentTimezone.default.tz.names();\n\n  for (var i = 0; i < tz_names.length; i++) {\n    var tz = (0, _jquery.default)(\"<option>\").text(tz_names[i]);\n    (0, _jquery.default)(target).append(tz);\n  }\n}\n\n(0, _jquery.default)(function () {\n  var theme_header_editor = _codemirror.default.fromTextArea(document.getElementById(\"theme-header\"), {\n    lineNumbers: true,\n    lineWrapping: true,\n    mode: \"htmlmixed\",\n    htmlMode: true\n  });\n\n  var theme_footer_editor = _codemirror.default.fromTextArea(document.getElementById(\"theme-footer\"), {\n    lineNumbers: true,\n    lineWrapping: true,\n    mode: \"htmlmixed\",\n    htmlMode: true\n  });\n\n  var theme_settings_editor = _codemirror.default.fromTextArea(document.getElementById(\"theme-settings\"), {\n    lineNumbers: true,\n    lineWrapping: true,\n    mode: {\n      name: \"javascript\",\n      json: true\n    }\n  }); // Handle refreshing codemirror when switching tabs.\n  // Better than the autorefresh approach b/c there's no flicker\n\n\n  (0, _jquery.default)(\"a[href='#theme']\").on(\"shown.bs.tab\", function (_e) {\n    theme_header_editor.refresh();\n    theme_footer_editor.refresh();\n    theme_settings_editor.refresh();\n  });\n  (0, _jquery.default)(\"#theme-settings-modal form\").submit(function (e) {\n    e.preventDefault();\n    theme_settings_editor.getDoc().setValue(JSON.stringify((0, _jquery.default)(this).serializeJSON(), null, 2));\n    (0, _jquery.default)(\"#theme-settings-modal\").modal(\"hide\");\n  });\n  (0, _jquery.default)(\"#theme-settings-button\").click(function () {\n    var form = (0, _jquery.default)(\"#theme-settings-modal form\");\n    var data; // Ignore invalid JSON data\n\n    try {\n      data = JSON.parse(theme_settings_editor.getValue());\n    } catch (e) {\n      data = {};\n    }\n\n    _jquery.default.each(data, function (key, value) {\n      var ctrl = form.find(\"[name='\".concat(key, \"']\"));\n\n      switch (ctrl.prop(\"type\")) {\n        case \"radio\":\n        case \"checkbox\":\n          ctrl.each(function () {\n            if ((0, _jquery.default)(this).attr(\"value\") == value) {\n              (0, _jquery.default)(this).attr(\"checked\", value);\n            }\n          });\n          break;\n\n        default:\n          ctrl.val(value);\n      }\n    });\n\n    (0, _jquery.default)(\"#theme-settings-modal\").modal();\n  });\n  insertTimezones((0, _jquery.default)(\"#start-timezone\"));\n  insertTimezones((0, _jquery.default)(\"#end-timezone\"));\n  insertTimezones((0, _jquery.default)(\"#freeze-timezone\"));\n  (0, _jquery.default)(\".config-section > form:not(.form-upload)\").submit(updateConfigs);\n  (0, _jquery.default)(\"#logo-upload\").submit(uploadLogo);\n  (0, _jquery.default)(\"#remove-logo\").click(removeLogo);\n  (0, _jquery.default)(\"#export-button\").click(exportConfig);\n  (0, _jquery.default)(\"#import-button\").click(importConfig);\n  (0, _jquery.default)(\"#config-color-update\").click(function () {\n    var hex_code = (0, _jquery.default)(\"#config-color-picker\").val();\n    var user_css = theme_header_editor.getValue();\n    var new_css;\n\n    if (user_css.length) {\n      var css_vars = \"theme-color: \".concat(hex_code, \";\");\n      new_css = user_css.replace(/theme-color: (.*);/, css_vars);\n    } else {\n      new_css = \"<style id=\\\"theme-color\\\">\\n\" + \":root {--theme-color: \".concat(hex_code, \";}\\n\") + \".navbar{background-color: var(--theme-color) !important;}\\n\" + \".jumbotron{background-color: var(--theme-color) !important;}\\n\" + \"</style>\\n\";\n    }\n\n    theme_header_editor.getDoc().setValue(new_css);\n  });\n  (0, _jquery.default)(\".start-date\").change(function () {\n    loadDateValues(\"start\");\n  });\n  (0, _jquery.default)(\".end-date\").change(function () {\n    loadDateValues(\"end\");\n  });\n  (0, _jquery.default)(\".freeze-date\").change(function () {\n    loadDateValues(\"freeze\");\n  });\n  var start = (0, _jquery.default)(\"#start\").val();\n  var end = (0, _jquery.default)(\"#end\").val();\n  var freeze = (0, _jquery.default)(\"#freeze\").val();\n\n  if (start) {\n    loadTimestamp(\"start\", start);\n  }\n\n  if (end) {\n    loadTimestamp(\"end\", end);\n  }\n\n  if (freeze) {\n    loadTimestamp(\"freeze\", freeze);\n  } // Toggle username and password based on stored value\n\n\n  (0, _jquery.default)(\"#mail_useauth\").change(function () {\n    (0, _jquery.default)(\"#mail_username_password\").toggle(this.checked);\n  }).change(); // Insert CommentBox element\n\n  var fieldList = _vueEsm.default.extend(_FieldList.default);\n\n  var vueContainer = document.createElement(\"div\");\n  document.querySelector(\"#user-field-list\").appendChild(vueContainer);\n  new fieldList({}).$mount(vueContainer);\n});\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/pages/configs.js?");
 
 /***/ })
 
diff --git a/CTFd/themes/admin/templates/config.html b/CTFd/themes/admin/templates/config.html
index 698a6911..ced41990 100644
--- a/CTFd/themes/admin/templates/config.html
+++ b/CTFd/themes/admin/templates/config.html
@@ -23,6 +23,9 @@
 				<li class="nav-item">
 					<a class="nav-link rounded-0" href="#accounts" role="tab" data-toggle="tab">Accounts</a>
 				</li>
+				<li class="nav-item">
+					<a class="nav-link rounded-0" href="#fields" role="tab" data-toggle="tab">Custom Fields</a>
+				</li>
 				<li class="nav-item">
 					<a class="nav-link rounded-0" href="#mlc" role="tab" data-toggle="tab">MajorLeagueCyber</a>
 				</li>
@@ -61,6 +64,8 @@
 
 				{% include "admin/configs/accounts.html" %}
 
+				{% include "admin/configs/fields.html" %}
+
 				{% include "admin/configs/mlc.html" %}
 
 				{% include "admin/configs/settings.html" %}
diff --git a/CTFd/themes/admin/templates/configs/fields.html b/CTFd/themes/admin/templates/configs/fields.html
new file mode 100644
index 00000000..2f7fff8d
--- /dev/null
+++ b/CTFd/themes/admin/templates/configs/fields.html
@@ -0,0 +1,24 @@
+<div role="tabpanel" class="tab-pane config-section" id="fields">
+	<form method="POST" autocomplete="off" class="w-100">
+		<h5>Custom Fields</h5>
+
+		<small class="form-text text-muted">
+			Add custom fields to get additional data from your participants
+		</small>
+
+		<ul class="nav nav-tabs mt-3" role="tablist">
+			<li class="nav-item active">
+				<a class="nav-link active" href="#user-fields" role="tab" data-toggle="tab">
+					Users
+				</a>
+			</li>
+		</ul>
+
+		<div class="tab-content">
+			<div role="tabpanel" class="tab-pane active" id="user-fields">
+				<div id="user-field-list" class="pt-3">
+				</div>
+			</div>
+		</div>
+	</form>
+</div>
\ No newline at end of file