diff --git a/BTCPayServer/Models/StoreViewModels/PayButtonViewModel.cs b/BTCPayServer/Models/StoreViewModels/PayButtonViewModel.cs
index ebb0dc362..6c688a26b 100644
--- a/BTCPayServer/Models/StoreViewModels/PayButtonViewModel.cs
+++ b/BTCPayServer/Models/StoreViewModels/PayButtonViewModel.cs
@@ -40,5 +40,6 @@ namespace BTCPayServer.Models.StoreViewModels
         public string UrlRoot { get; set; }
         public List<string> CurrencyDropdown { get; set; }
         public string PayButtonImageUrl { get; set; }
+        public string PayButtonText { get; set; }
     }
 }
diff --git a/BTCPayServer/Views/Stores/PayButton.cshtml b/BTCPayServer/Views/Stores/PayButton.cshtml
index bcd1f633b..787dfac77 100644
--- a/BTCPayServer/Views/Stores/PayButton.cshtml
+++ b/BTCPayServer/Views/Stores/PayButton.cshtml
@@ -47,15 +47,26 @@
     <br />
     <div class="row">
         <div class="col-lg-7">
+            <div class="form-group">
+                <label>
+                    <input type="checkbox" v-model="buttonInlineTextMode" v-on:change="inputChanges" class="form-check-inline"/> Customize text in button
+                </label>
+            </div>
+            <div class="form-group" v-show="buttonInlineTextMode">
+                <label>Pay Button Text</label>
+                <input name="payButtonText" type="text" class="form-control" id="inputAddress"
+                       v-model="srvModel.payButtonText" v-on:change="inputChanges">
+            </div>
             <div class="form-group">
                 <label>Pay Button Image Url</label>
                 <input name="payButtonImageUrl" type="text" class="form-control" id="inputAddress"
                        v-model="srvModel.payButtonImageUrl" v-on:change="inputChanges"
-                       v-validate="'required|url'" :class="{'is-invalid': errors.has('payButtonImageUrl') }">
+                       v-validate="{ required: this.imageUrlRequired, url: {require_tld:false} }"
+                       :class="{'is-invalid': errors.has('payButtonImageUrl') }">
                 <small class="text-danger">{{ errors.first('payButtonImageUrl') }}</small>
             </div>
             <div class="form-group">
-                <label>Button Size</label>
+                <label>Image Size</label>
                 <div style="vertical-align:top; font-size:12px; display:flex;">
                     <button class="btn text-nowrap" style="width:146px;height:40px;margin-right:40px;"
                             v-on:click="inputChanges($event, 0)" v-bind:class="{'btn-primary': (srvModel.buttonSize == 0) }">
@@ -74,15 +85,15 @@
             <div class="form-group">
                 <label>Button Type</label>
                 <div>
-                    <input type="radio" name="button-type" id="btn-fixed" value="0" v-model="srvModel.buttonType" v-on:change="inputChanges" checked />
+                    <input type="radio" name="button-type" id="btn-fixed" value="0" v-model="srvModel.buttonType" v-on:change="inputChanges" checked/>
                     <label for="btn-fixed">Fixed amount</label>
                 </div>
                 <div>
-                    <input type="radio" name="button-type" id="btn-custom" value="1" v-model="srvModel.buttonType" v-on:change="inputChanges" />
+                    <input type="radio" name="button-type" id="btn-custom" value="1" v-model="srvModel.buttonType" v-on:change="inputChanges"/>
                     <label for="btn-custom">Custom amount</label>
                 </div>
                 <div>
-                    <input type="radio" name="button-type" id="btn-slider" value="2" v-model="srvModel.buttonType" v-on:change="inputChanges" />
+                    <input type="radio" name="button-type" id="btn-slider" value="2" v-model="srvModel.buttonType" v-on:change="inputChanges"/>
                     <label for="btn-slider">Slider</label>
                 </div>
             </div>
@@ -122,15 +133,15 @@
                     <small class="text-danger">{{ errors.first('simpleInput') }}</small>
                 </div>
                 <div class="form-check">
-                   <input name="fitButtonInline"
-                          id="fitButtonInline"
-                          type="checkbox"
-                          class="form-check-input"
-                          v-model="srvModel.fitButtonInline"
-                          v-on:change="inputChanges"
-                          :class="{'is-invalid': errors.has('fitButtonInline') }">
-                   <label class="form-check-label" for="fitButtonInline">Fit button inline</label>
-                   <small class="text-danger">{{ errors.first('fitButtonInline') }}</small>
+                    <input name="fitButtonInline"
+                           id="fitButtonInline"
+                           type="checkbox"
+                           class="form-check-input"
+                           v-model="srvModel.fitButtonInline"
+                           v-on:change="inputChanges"
+                           :class="{'is-invalid': errors.has('fitButtonInline') }">
+                    <label class="form-check-label" for="fitButtonInline">Fit button inline</label>
+                    <small class="text-danger">{{ errors.first('fitButtonInline') }}</small>
                 </div>
             </div>
         </div>
@@ -232,13 +243,33 @@
         var payButtonCtrl = new Vue({
             el: '#payButtonCtrl',
             data: {
-                srvModel: srvModel
+                srvModel: srvModel,
+                originalButtonImageUrl: srvModel.payButtonImageUrl,
+                buttonInlineTextMode: false
+            },
+            computed: {
+                imageUrlRequired: function(){
+                    return !this.buttonInlineTextMode;
+                }
             },
             methods: {
                 inputChanges: function (event, buttonSize) {
                     inputChanges(event, buttonSize);
                 }
-            }
+                
+            },
+            watch: {
+                buttonInlineTextMode: function (checked) {
+                  if(!checked){
+                      this.srvModel.payButtonText = "";
+                      this.srvModel.payButtonImageUrl = this.originalButtonImageUrl;
+                  }else {
+                      this.srvModel.payButtonText = "Pay with..";
+                      this.srvModel.payButtonImageUrl = this.srvModel.urlRoot + "img/logo.svg";
+                  }
+                  this.inputChanges();
+                }
+              }
         });
     </script>
 }
diff --git a/BTCPayServer/wwwroot/paybutton/paybutton.js b/BTCPayServer/wwwroot/paybutton/paybutton.js
index dc445186a..342bbba9e 100644
--- a/BTCPayServer/wwwroot/paybutton/paybutton.js
+++ b/BTCPayServer/wwwroot/paybutton/paybutton.js
@@ -51,14 +51,18 @@ function inputChanges(event, buttonSize) {
     var isSlider = srvModel.buttonType == 2
 
     var width = "209px";
+    var height = "57px";
     var widthInput = "3em";
     if (srvModel.buttonSize === 0) {
         width = "146px";
         widthInput = "2em";
+        height = "40px";
     } else if (srvModel.buttonSize === 1) {
         width = "168px";
+        height = "46px";
     } else if (srvModel.buttonSize === 2) {
         width = "209px";
+        height = "57px";
     }
 
     var html =
@@ -103,8 +107,15 @@ function inputChanges(event, buttonSize) {
         html += addSlider(srvModel.price, srvModel.min, srvModel.max, srvModel.step, width);
         html += '  </div>\n';
     }
-
-    html += '  <input type="image" class="submit" name="submit" src="' + esc(srvModel.payButtonImageUrl) + '" style="width:' + width + '" alt="Pay with BtcPay, Self-Hosted Bitcoin Payment Processor">\n';
+    
+    if(!srvModel.payButtonText){
+        html += '  <input type="image" class="submit" name="submit" src="' + esc(srvModel.payButtonImageUrl) + '" style="width:' + width + '" alt="Pay with BtcPay, Self-Hosted Bitcoin Payment Processor">\n';
+    }else{
+        var numwidth = parseInt(width.replace("px", ""));
+        html+= '<button type="submit" class="submit" name="submit" style="min-width:' + width + '; min-height:' + height + '; border-radius: 4px;border-style: none;background-color: #0f3b21;" alt="Pay with BtcPay, Self-Hosted Bitcoin Payment Processor"><span style="color:#fff">'+esc(srvModel.payButtonText)+'</span>\n' +
+            (srvModel.payButtonImageUrl? '<img src="'+esc(srvModel.payButtonImageUrl)+'" style="width:'+numwidth/2+'px;">\n' : '')+
+            '</button>'
+    }
     html += '</form>';
 
     $("#mainCode").text(html).html();