diff --git a/Resources/Plugins/edit-design/browser.js b/Resources/Plugins/edit-design/browser.js
index dc9b08e8..47d01308 100644
--- a/Resources/Plugins/edit-design/browser.js
+++ b/Resources/Plugins/edit-design/browser.js
@@ -114,6 +114,10 @@ enabled(){
     let modal = $("#td-design-plugin-modal");
     this.setAndShowContainer(modal, false);
     
+    let getTextForCustom = function(key){
+      return "Custom ("+me.config[key]+")";
+    };
+    
     modal.find("[data-td-key]").each(function(){
       let item = $(this);
       let tag = item.prop("tagName");
@@ -133,10 +137,29 @@ enabled(){
       }
       // SELECTS
       else if (tag === "SELECT"){
-        item.val(me.config[key]);
+        if (!item.val(me.config[key]).val()){
+          let custom = item.find("option[value='custom']");
+          
+          if (custom.length === 1){
+            item.val("custom");
+            custom.text(getTextForCustom(key));
+          }
+        }
         
-        item.change(function(){
-          updateKey(key, item.val());
+        item.change(function(){ // TODO change doesn't fire when Custom is already selected
+          let val = item.val();
+          
+          if (val === "custom"){
+            val = prompt("Enter custom value:");
+            
+            if (val){
+              updateKey(key, val);
+              item.find("option[value='custom']").text(getTextForCustom(key));
+            }
+          }
+          else{
+            updateKey(key, item.val());
+          }
         });
       }
       // CUSTOM ELEMENTS
diff --git a/Resources/Plugins/edit-design/modal.html b/Resources/Plugins/edit-design/modal.html
index 3799ef87..d05a856c 100644
--- a/Resources/Plugins/edit-design/modal.html
+++ b/Resources/Plugins/edit-design/modal.html
@@ -36,6 +36,7 @@
               <option value="310px">Medium (310px)</option>
               <option value="350px">Wide (350px)</option>
               <option value="400px">Extreme (400px)</option>
+              <option value="custom">Custom</option>
             </optgroup>
             <option disabled></option>
             <optgroup label="Dynamic width">
@@ -53,13 +54,12 @@
             <b>Font size</b>
           </label>
           <select data-td-key="fontSize">
-            <option value="12px" data-td-font-size="smallest">Tiny (12px)</option>
-            <option value="13px" data-td-font-size="small">Small (13px)</option>
-            <option value="14px" data-td-font-size="medium">Medium (14px)</option>
-            <option value="15px" data-td-font-size="large">Large (15px)</option>
-            <option value="16px" data-td-font-size="largest">Very Large (16px)</option>
-            <option value="18px" data-td-font-size="largest">Massive (18px)</option>
-            <option value="20px" data-td-font-size="largest">Extreme (20px)</option>
+            <option value="12px">Tiny (12px)</option>
+            <option value="13px">Small (13px)</option>
+            <option value="14px">Medium (14px)</option>
+            <option value="15px">Large (15px)</option>
+            <option value="16px">Largest (16px)</option>
+            <option value="custom">Custom</option>
           </select>
         </div>