diff --git a/WebHostLib/static/styles/weightedOptions/weightedOptions.css b/WebHostLib/static/styles/weightedOptions/weightedOptions.css
index bf6fd9cc6758..a769e315f6c6 100644
--- a/WebHostLib/static/styles/weightedOptions/weightedOptions.css
+++ b/WebHostLib/static/styles/weightedOptions/weightedOptions.css
@@ -172,6 +172,9 @@ html {
   display: inline-block;
   font-size: 1.3rem;
 }
+#weighted-options .unsupported-option {
+  margin-top: 0.5rem;
+}
 #weighted-options .world-container .options-container {
   display: none;
   flex-direction: column;
@@ -181,6 +184,22 @@ html {
   display: none;
   flex-direction: column;
 }
+#weighted-options .world-container .options-container .options-wrapper .custom-value-wrapper {
+  display: flex;
+  flex-direction: row;
+  margin-top: 0.5rem;
+}
+#weighted-options .world-container .options-container .options-wrapper .custom-value-wrapper button {
+  width: auto;
+  height: auto;
+  padding: 0 0.25rem;
+  margin-left: 0.15rem;
+  border-radius: 4px;
+  cursor: default;
+}
+#weighted-options .world-container .options-container .options-wrapper .custom-value-wrapper button:active {
+  margin-bottom: 1px;
+}
 #weighted-options .world-container:has(h2.world-name):has(input[type=checkbox].collapse-toggle:checked) .options-container {
   display: flex;
 }
@@ -193,7 +212,7 @@ html {
 #weighted-options .world-container:has(h2.world-name):has(input[type=checkbox].collapse-toggle:checked) span.world-collapse-arrow {
   transform: rotate(90deg);
 }
-#weighted-options .set-container {
+#weighted-options .set-container, #weighted-options .dict-container, #weighted-options .list-container {
   display: flex;
   flex-direction: column;
   background-color: rgba(0, 0, 0, 0.25);
@@ -206,14 +225,14 @@ html {
   padding-right: 0.25rem;
   padding-left: 0.25rem;
 }
-#weighted-options .set-container .set-divider {
+#weighted-options .set-container .divider, #weighted-options .dict-container .divider, #weighted-options .list-container .divider {
   width: 100%;
   height: 2px;
   background-color: rgba(20, 20, 20, 0.25);
   margin-top: 0.125rem;
   margin-bottom: 0.125rem;
 }
-#weighted-options .set-container .set-entry {
+#weighted-options .set-container .set-entry, #weighted-options .set-container .dict-entry, #weighted-options .set-container .list-entry, #weighted-options .dict-container .set-entry, #weighted-options .dict-container .dict-entry, #weighted-options .dict-container .list-entry, #weighted-options .list-container .set-entry, #weighted-options .list-container .dict-entry, #weighted-options .list-container .list-entry {
   display: flex;
   flex-direction: row;
   align-items: flex-start;
@@ -222,13 +241,13 @@ html {
   user-select: none;
   line-height: 1rem;
 }
-#weighted-options .set-container .set-entry:hover {
+#weighted-options .set-container .set-entry:hover, #weighted-options .set-container .dict-entry:hover, #weighted-options .set-container .list-entry:hover, #weighted-options .dict-container .set-entry:hover, #weighted-options .dict-container .dict-entry:hover, #weighted-options .dict-container .list-entry:hover, #weighted-options .list-container .set-entry:hover, #weighted-options .list-container .dict-entry:hover, #weighted-options .list-container .list-entry:hover {
   background-color: rgba(20, 20, 20, 0.25);
 }
-#weighted-options .set-container .set-entry input[type=checkbox] {
+#weighted-options .set-container .set-entry input[type=checkbox], #weighted-options .set-container .dict-entry input[type=checkbox], #weighted-options .set-container .list-entry input[type=checkbox], #weighted-options .dict-container .set-entry input[type=checkbox], #weighted-options .dict-container .dict-entry input[type=checkbox], #weighted-options .dict-container .list-entry input[type=checkbox], #weighted-options .list-container .set-entry input[type=checkbox], #weighted-options .list-container .dict-entry input[type=checkbox], #weighted-options .list-container .list-entry input[type=checkbox] {
   margin-right: 0.25rem;
 }
-#weighted-options .set-container .set-entry input[type=number] {
+#weighted-options .set-container .set-entry input[type=number], #weighted-options .set-container .dict-entry input[type=number], #weighted-options .set-container .list-entry input[type=number], #weighted-options .dict-container .set-entry input[type=number], #weighted-options .dict-container .dict-entry input[type=number], #weighted-options .dict-container .list-entry input[type=number], #weighted-options .list-container .set-entry input[type=number], #weighted-options .list-container .dict-entry input[type=number], #weighted-options .list-container .list-entry input[type=number] {
   max-width: 1.5rem;
   max-height: 1rem;
   margin-left: 0.125rem;
@@ -236,11 +255,11 @@ html {
   /* Hide arrows on input[type=number] fields */
   -moz-appearance: textfield;
 }
-#weighted-options .set-container .set-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .set-container .set-entry input[type=number]::-webkit-inner-spin-button {
+#weighted-options .set-container .set-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .set-container .set-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .set-container .dict-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .set-container .dict-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .set-container .list-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .set-container .list-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .dict-container .set-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .dict-container .set-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .dict-container .dict-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .dict-container .dict-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .dict-container .list-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .dict-container .list-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .list-container .set-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .list-container .set-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .list-container .dict-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .list-container .dict-entry input[type=number]::-webkit-inner-spin-button, #weighted-options .list-container .list-entry input[type=number]::-webkit-outer-spin-button, #weighted-options .list-container .list-entry input[type=number]::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
 }
-#weighted-options .set-container .set-entry label {
+#weighted-options .set-container .set-entry label, #weighted-options .set-container .dict-entry label, #weighted-options .set-container .list-entry label, #weighted-options .dict-container .set-entry label, #weighted-options .dict-container .dict-entry label, #weighted-options .dict-container .list-entry label, #weighted-options .list-container .set-entry label, #weighted-options .list-container .dict-entry label, #weighted-options .list-container .list-entry label {
   flex-grow: 1;
   margin-right: 0;
   min-width: unset;
diff --git a/WebHostLib/static/styles/weightedOptions/weightedOptions.css.map b/WebHostLib/static/styles/weightedOptions/weightedOptions.css.map
index 933464022494..8adc528a9715 100644
--- a/WebHostLib/static/styles/weightedOptions/weightedOptions.css.map
+++ b/WebHostLib/static/styles/weightedOptions/weightedOptions.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["weightedOptions.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;EACA;;AAIR;EACI;;AAGJ;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAOZ;EACI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAIA;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAMR;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAKJ;EACI;;AAGI;EACI;;AAGJ;EACI;;AAKZ;EACI;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;AAEA;EACA;;AACA;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;;AAMhB;EACI;IACI;IACA;;EAGJ;IACI;IACA","file":"weightedOptions.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["weightedOptions.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;EACA;;AAIR;EACI;;AAGJ;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAOZ;EACI;;AAGJ;EACI;EACA;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAIA;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAKZ;EACI;;AAIA;EACI;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAQhB;EACI;;AAGI;EACI;;AAGJ;EACI;;AAKZ;EACI;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;AAEA;EACA;;AACA;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;;;AAMhB;EACI;IACI;IACA;;EAGJ;IACI;IACA","file":"weightedOptions.css"}
\ No newline at end of file
diff --git a/WebHostLib/static/styles/weightedOptions/weightedOptions.scss b/WebHostLib/static/styles/weightedOptions/weightedOptions.scss
index 338166129491..0aa062c73c82 100644
--- a/WebHostLib/static/styles/weightedOptions/weightedOptions.scss
+++ b/WebHostLib/static/styles/weightedOptions/weightedOptions.scss
@@ -208,6 +208,10 @@ html{
         }
     }
 
+    .unsupported-option{
+        margin-top: 0.5rem;
+    }
+
     .world-container{
         .options-container{
             display: none;
@@ -217,6 +221,25 @@ html{
                 margin-left: 0.5rem;
                 display: none;
                 flex-direction: column;
+
+                .custom-value-wrapper{
+                    display: flex;
+                    flex-direction: row;
+                    margin-top: 0.5rem;
+
+                    button{
+                        width: auto;
+                        height: auto;
+                        padding: 0 0.25rem;
+                        margin-left: 0.15rem;
+                        border-radius: 4px;
+                        cursor: default;
+
+                        &:active{
+                            margin-bottom: 1px;
+                        }
+                    }
+                }
             }
         }
 
@@ -241,7 +264,7 @@ html{
         }
     }
 
-    .set-container{
+    .set-container, .dict-container, .list-container{
         display: flex;
         flex-direction: column;
         background-color: rgba(0, 0, 0, 0.25);
@@ -254,7 +277,7 @@ html{
         padding-right: 0.25rem;
         padding-left: 0.25rem;
 
-        .set-divider{
+        .divider{
             width: 100%;
             height: 2px;
             background-color: rgba(20, 20, 20, 0.25);
@@ -262,7 +285,7 @@ html{
             margin-bottom: 0.125rem;
         }
 
-        .set-entry{
+        .set-entry, .dict-entry, .list-entry{
             display: flex;
             flex-direction: row;
             align-items: flex-start;
diff --git a/WebHostLib/templates/weightedOptions/macros.html b/WebHostLib/templates/weightedOptions/macros.html
index ca6a719c9335..678ef9368ed2 100644
--- a/WebHostLib/templates/weightedOptions/macros.html
+++ b/WebHostLib/templates/weightedOptions/macros.html
@@ -64,11 +64,38 @@
 {% endmacro %}
 
 {% macro FreeText(world_name, option_name, option) %}
-
+    <div class="hint-text">
+        This option allows custom values only. Please enter your desired values below.
+        <div class="custom-value-wrapper">
+            <input class="custom-value" data-option="{{ world_name }}-{{ option_name }}" placeholder="Custom Value" />
+            <button data-option="{{ world_name }}-{{ option_name }}">Add</button>
+        </div>
+        <table>
+            <tbody>
+                <!-- This table to be filled by JS -->
+            </tbody>
+        </table>
+    </div>
 {% endmacro %}
 
 {% macro TextChoice(world_name, option_name, option) %}
-
+    <div class="hint-text">
+        Custom values are also allowed for this option. To create one, enter it into the input box below.
+        <div class="custom-value-wrapper">
+            <input class="custom-value" data-option="{{ world_name }}-{{ option_name }}" placeholder="Custom Value" />
+            <button data-option="{{ world_name }}-{{ option_name }}">Add</button>
+        </div>
+    </div>
+    <table>
+        <tbody>
+            {% for id, name in option.name_lookup.items() %}
+                {% if name != 'random' %}
+                    {{ RangeRow(world_name, option_name, option, option.get_option_name(id), name) }}
+                {% endif %}
+            {% endfor %}
+            {{ RandomRows(world_name, option_name, option) }}
+        </tbody>
+    </table>
 {% endmacro %}
 
 {% macro PlandoBosses(world_name, option_name, option) %}
@@ -77,11 +104,37 @@
 {% endmacro %}
 
 {% macro ItemDict(world_name, option_name, option, world) %}
-
+    <div class="dict-container">
+        {% for item_name in world.item_names|sort %}
+            <div class="dict-entry">
+                <label for="{{ world_name }}-{{ option_name }}-{{ item_name }}-qty">{{ item_name }}</label>
+                <input
+                    type="number"
+                    id="{{ world_name }}-{{ option_name }}-{{ item_name }}-qty"
+                    name="{{ world_name }}-{{ option_name }}-{{ item_name }}-qty"
+                    value="0"
+                />
+            </div>
+        {% endfor %}
+    </div>
 {% endmacro %}
 
 {% macro OptionList(world_name, option_name, option) %}
-
+    <div class="list-container">
+        {% for key in option.valid_keys|sort %}
+            <div class="list-entry">
+                <input
+                    type="checkbox"
+                    id="{{ world_name }}-{{ option_name }}-{{ key }}"
+                    name="{{ world_name }}-{{ option_name }}-{{ key }}"
+                    value="1"
+                />
+                <label for="{{ world_name }}-{{ option_name }}-{{ key }}">
+                    {{ key }}
+                </label>
+            </div>
+        {% endfor %}
+    </div>
 {% endmacro %}
 
 {% macro LocationSet(world_name, option_name, option, world) %}
@@ -95,7 +148,7 @@
             {% endif %}
         {% endfor %}
         {% if world.location_name_groups.keys()|length > 1 %}
-            <div class="set-divider">&nbsp;</div>
+            <div class="divider">&nbsp;</div>
         {% endif %}
         {% for location_name in world.location_names|sort %}
             <div class="set-entry">
diff --git a/WebHostLib/templates/weightedOptions/weightedOptions.html b/WebHostLib/templates/weightedOptions/weightedOptions.html
index dc18b027f8c1..0b70d77b0960 100644
--- a/WebHostLib/templates/weightedOptions/weightedOptions.html
+++ b/WebHostLib/templates/weightedOptions/weightedOptions.html
@@ -130,6 +130,11 @@ <h4>{{ option.display_name|default(option_name) }}</h4>
                                             {% elif issubclass(option, Options.OptionSet) and option.valid_keys %}
                                                 {{ inputs.OptionSet(world_name, option_name, option) }}
 
+                                            {% else %}
+                                                <div class="unsupported-option">
+                                                    This option is not supported. Please edit your .yaml file manually.
+                                                </div>
+
                                             {% endif %}
                                         </div>
                                     {% endfor %}