diff --git a/web/application/views/info2.html b/web/application/views/info2.html
index d808cf0..19ad483 100644
--- a/web/application/views/info2.html
+++ b/web/application/views/info2.html
@@ -23,9 +23,12 @@
                         <option value="transfeminine">Transfeminine</option>
                         <option value="transmasculine">Transmasculine</option>
                         <option value="trigenderpyrofox">Tri-gender pyrofox (from the forest planet)</option>
-
                     </select>
                 </div>
+                <div class="form-group">
+                    <label>Or enter a custom gender:</label>
+                    <input type="text" id="customGender"> <button id="genderAdd" type="button" class="btn btn-primary">Set</button>
+                </div>
                 <nav>
                     <ul class="pager">
                         <li><a href="./main/info/1">Prev</a></li>
@@ -44,6 +47,31 @@
         $("#gender").on("change", function () {
             $.post("./main/sessionset/gender/", {"gender": $(this).val()});
         });
+
+
+        function addGender() {
+            var value = $("#customGender").val();
+            if (value) {
+                $("#gender").append($("<option/>", {
+                    value: value.toLowerCase(),
+                    text: value.toLowerCase(),
+                    selected: "selected"
+                }));
+
+                $("#gender").val(value).change();
+                $("#customGender").val("");
+            }
+        }
+
+        $("#customGender").keyup(function (e) {
+            if (e.which == $.ui.keyCode.ENTER) {
+                addGender();
+            }
+        });
+
+        $("#genderAdd").click(function () {
+            addGender();
+        });
     });
 </script>
 
diff --git a/web/application/views/info3.html b/web/application/views/info3.html
index a47fd17..4aab68d 100644
--- a/web/application/views/info3.html
+++ b/web/application/views/info3.html
@@ -25,6 +25,10 @@
 
                     </select>
                 </div>
+                <div class="form-group">
+                    <label>Or enter a custom gender:</label>
+                    <input type="text" id="customGender"> <button id="genderAdd" type="button" class="btn btn-primary">Add</button>
+                </div>
                 <nav>
                     <ul class="pager">
                         <li><a href="./main/info/1">Prev</a></li>
@@ -43,6 +47,31 @@
         $("#looking").on("change", function () {
             $.post("./main/sessionset/looking/", {"looking": $(this).val()});
         });
+
+        function addGender() {
+            var value = $("#customGender").val();
+            if (value) {
+                $("#looking").append($("<option/>", {
+                    value: value.toLowerCase(),
+                    text: value.toLowerCase(),
+                    selected: "selected"
+                }));
+                var original = $("#looking").val();
+                var newval = $.merge([value], original);
+                $("#looking").val(newval).change();
+                $("#customGender").val("");
+            }
+        }
+
+        $("#customGender").keyup(function (e) {
+            if (e.which == $.ui.keyCode.ENTER) {
+                addGender();
+            }
+        });
+
+        $("#genderAdd").click(function () {
+            addGender();
+        });
     });
 </script>