diff --git a/lnbits/extensions/deezy/config.json b/lnbits/extensions/deezy/config.json
index 200d1220..27c4df2d 100644
--- a/lnbits/extensions/deezy/config.json
+++ b/lnbits/extensions/deezy/config.json
@@ -1,6 +1,6 @@
 {
   "name": "Deezy",
   "short_description": "Join us, make an extension",
-  "icon": "info",
+  "icon": "swap_horiz",
   "contributors": ["Uthpala"]
 }
diff --git a/lnbits/extensions/deezy/templates/deezy/index.html b/lnbits/extensions/deezy/templates/deezy/index.html
new file mode 100644
index 00000000..007144f0
--- /dev/null
+++ b/lnbits/extensions/deezy/templates/deezy/index.html
@@ -0,0 +1,255 @@
+{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
+%} {% block page %}
+<q-card>
+  <q-card-section>
+    <h5 class="text-subtitle1 q-mt-none q-mb-md">
+      Deezy
+    </h5>
+    <q-separator class="q-my-lg"></q-separator>
+    <q-card>
+      <q-card-section>
+        <q-btn
+          label="Swap (In)"
+          unelevated
+          color="primary"
+          @click="swapLnToBtc.show = true; swapBtcToLn.show = false"
+        >
+          <q-tooltip class="bg-grey-8" anchor="bottom left" self="top left">
+            Send onchain funds offchain (BTC -> LN)
+          </q-tooltip>
+        </q-btn>
+        <q-btn
+          label="Reverse Swap (Out)"
+          unelevated
+          color="primary"
+          @click="swapBtcToLn.show = true; swapLnToBtc.show = false;"
+        >
+          <q-tooltip class="bg-grey-8" anchor="bottom left" self="top left">
+            Send offchain funds to onchain address (LN -> BTC)
+          </q-tooltip>
+        </q-btn>
+      </q-card-section>
+    </q-card>
+    <div v-show="swapLnToBtc.show" class="q-pa-lg q-pt-xl lnbits__dialog-card">
+      <h6 class="q-mt-none">Lightning Btc -> Btc</h6>
+      <q-form @submit="sendLnToBtc" class="q-gutter-md">
+        <q-input
+          filled
+          dense
+          emit-value
+          v-model.trim="swapLnToBtc.data.amount"
+          label="Amount"
+          type="number"
+        ></q-input>
+        <q-input
+          filled
+          dense
+          emit-value
+          v-model.trim="swapLnToBtc.data.refund_address"
+          type="string"
+          label="Onchain address to receive funds"
+        ></q-input>
+        <q-input
+          filled
+          dense
+          emit-value
+          v-model.trim="swapLnToBtc.data.onChainFees"
+          label="On chain fees"
+          min="1"
+          type="number"
+        ></q-input>
+        <q-btn
+          unelevated
+          color="primary"
+          type="submit"
+          label="Create Swap"
+        ></q-btn>
+        <q-btn
+          flat
+          color="grey"
+          class="q-ml-auto"
+          @click="resetSwapLnToBtc"
+        >Cancel</q-btn>
+      </q-form>
+      <q-dialog v-model="swapLnToBtc.showInvoice" persistent>
+        <q-card flat bordered class="my-card">
+          <q-card-section>
+            <div class="flex justify-between">
+              <div class="text-h6">Pay invoice to complete swap</div>
+              <q-btn flat v-close-popup>
+                <q-icon name="close" />
+              </q-btn>
+            </div>
+          </q-card-section>
+          <q-card-section class="q-pt-none">
+            <qrcode
+              :value="swapLnToBtc.response"
+              :options="{width: 360}"
+              class="rounded-borders"
+            ></qrcode>
+          </q-card-section>
+          <q-card-section>
+            <q-btn outline @click="copyLnInvoice" label="Copy" color="primary"></q-btn>
+            <q-input
+              v-model="swapLnToBtc.response"
+              type="textarea"
+              readonly
+              @click="$event.target.select()"
+            />
+          </q-card-section>
+        </q-card>
+      </q-dialog>
+    </div>
+    <div v-show="swapBtcToLn.show" class="q-pa-lg q-pt-xl lnbits__dialog-card">
+      <h6 class="q-mt-none">Btc -> Lightning Btc</h6>
+      <q-form @submit="sendBtcToLn" class="q-gutter-md">
+        <q-input
+          filled
+          dense
+          emit-value
+          v-model.trim="swapBtcToLn.data.lnurl_or_lnaddress"
+          label="Lnurl or Lightning Address"
+          type="string"
+        ></q-input>
+        <q-input
+          filled
+          dense
+          emit-value
+          v-model.trim="swapBtcToLn.data.secret_access_key"
+          type="string"
+          label="Secret Access Key"
+        ></q-input>
+        <q-input
+          filled
+          dense
+          emit-value
+          v-model.trim="swapBtcToLn.data.webhook_url"
+          label="Webhook url"
+          type="string"
+        ></q-input>
+        <q-btn
+          unelevated
+          color="primary"
+          type="submit"
+          label="Create Swap"
+        ></q-btn>
+        <q-btn
+          flat
+          color="grey"
+          class="q-ml-auto"
+          @click="resetSwapBtcToLn"
+        >Cancel</q-btn>
+      </q-form>
+      <q-dialog v-model="swapBtcToLn.showDetails" persistent maximized>
+        <q-card flat bordered class="my-card">
+          <q-card-section>
+            <div class="flex justify-between">
+              <div class="text-h6">Response - Important</div>
+              <q-btn flat v-close-popup>
+                <q-icon name="close" />
+              </q-btn>
+            </div>
+          </q-card-section>
+          {% raw %}
+          <q-card-section>
+            Address - {{ swapBtcToLn.response.address }} 
+          </q-card-section>
+          <q-card-section>
+            Commitment - {{ swapBtcToLn.response.commitment }}
+          </q-card-section>
+          <q-card-section>
+            Secret Access Key - {{ swapBtcToLn.response.secret_access_key }}
+          </q-card-section>
+          <q-card-section>
+            Signature - {{ swapBtcToLn.response.signature }}
+          </q-card-section>
+          <q-card-section>
+            Webhook Url - {{ swapBtcToLn.response.webhook_url }}
+          </q-card-section>
+          {% endraw %}
+        </q-card>
+      </q-dialog>
+    </div>
+</q-card>
+{% endblock %} {% block scripts %} {{ window_vars(user) }}
+<script>
+  Vue.component(VueQrcode.name, VueQrcode)
+  new Vue({
+    el: '#vue',
+    mixins: [windowMixin],
+    data: function () {
+      return {
+        lightning_btc: "",
+        tools: [],
+        swapLnToBtc: {
+          show: false,
+          showInvoice: false,
+          data: {
+            onChainFees: 1
+          },
+          response: null
+        },
+        swapBtcToLn: {
+          show: false,
+          showDetails: false,
+          data: {},
+          response: {}
+        },
+      }
+    },
+    methods: {
+      copyLnInvoice() {
+        Quasar.utils.copyToClipboard(this.swapLnToBtc.response)
+      },
+      sendLnToBtc() {
+        var self = this
+        axios.post('https://api-testnet.deezy.io/v1/swap', {
+          amount_sats: self.swapLnToBtc.data.amount,
+          on_chain_address: self.swapLnToBtc.data.on_chain_address,
+          on_chain_sats_per_vbyte: self.swapLnToBtc.data.on_chain_sats_per_vbyte
+        })
+        .then(function (response) {
+          self.swapLnToBtc = {
+            ...self.swapLnToBtc,
+            showInvoice: true,
+            response: response.data.bolt11_invoice
+          }
+        })
+        .catch(function (error) {
+          console.log(error);
+        });
+      },
+      sendBtcToLn() {
+        var self = this
+        axios.post('https://api-testnet.deezy.io/v1/source', {
+          lnurl_or_lnaddress: self.swapBtcToLn.data.lnurl_or_lnaddress,
+          secret_access_key: self.swapBtcToLn.data.secret_access_key,
+          webhook_url: self.swapBtcToLn.data.webhook_url
+        })
+        .then(function (response) {
+          self.swapBtcToLn = {
+            ...self.swapBtcToLn,
+            response: response.data,
+            showDetails: true,
+          }
+        })
+        .catch(function (error) {
+          console.log(error);
+        });
+      },
+      resetSwapBtcToLn() {
+        this.swapBtcToLn = {
+          ...this.swapBtcToLn,
+          data: {},
+        }
+      },
+      resetSwapLnToBtc() {
+        this.swapLnToBtc = {
+          ...this.swapLnToBtc,
+          data: {}
+        }
+      },
+    }
+  })
+</script>
+{% endblock %}
diff --git a/lnbits/extensions/deezy/templates/example/index.html b/lnbits/extensions/deezy/templates/example/index.html
deleted file mode 100644
index d732ef37..00000000
--- a/lnbits/extensions/deezy/templates/example/index.html
+++ /dev/null
@@ -1,59 +0,0 @@
-{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
-%} {% block page %}
-<q-card>
-  <q-card-section>
-    <h5 class="text-subtitle1 q-mt-none q-mb-md">
-      Frameworks used by {{SITE_TITLE}}
-    </h5>
-    <q-list>
-      <q-item
-        v-for="tool in tools"
-        :key="tool.name"
-        tag="a"
-        :href="tool.url"
-        target="_blank"
-      >
-        {% raw %}
-        <!-- with raw Flask won't try to interpret the Vue moustaches -->
-        <q-item-section>
-          <q-item-label>{{ tool.name }}</q-item-label>
-          <q-item-label caption>{{ tool.language }}</q-item-label>
-        </q-item-section>
-        {% endraw %}
-      </q-item>
-    </q-list>
-    <q-separator class="q-my-lg"></q-separator>
-    <p>
-      A magical "g" is always available, with info about the user, wallets and
-      extensions:
-    </p>
-    <code class="text-caption">{% raw %}{{ g }}{% endraw %}</code>
-  </q-card-section>
-</q-card>
-{% endblock %} {% block scripts %} {{ window_vars(user) }}
-<script>
-  new Vue({
-    el: '#vue',
-    mixins: [windowMixin],
-    data: function () {
-      return {
-        tools: []
-      }
-    },
-    created: function () {
-      var self = this
-
-      // axios is available for making requests
-      axios({
-        method: 'GET',
-        url: '/example/api/v1/tools',
-        headers: {
-          'X-example-header': 'not-used'
-        }
-      }).then(function (response) {
-        self.tools = response.data
-      })
-    }
-  })
-</script>
-{% endblock %}
diff --git a/lnbits/extensions/deezy/views.py b/lnbits/extensions/deezy/views.py
index b8efeae8..131c03b2 100644
--- a/lnbits/extensions/deezy/views.py
+++ b/lnbits/extensions/deezy/views.py
@@ -17,5 +17,5 @@ async def index(
     user: User = Depends(check_user_exists),  # type: ignore
 ):
     return deezy_renderer().TemplateResponse(
-        "example/index.html", {"request": request, "user": user.dict()}
+        "deezy/index.html", {"request": request, "user": user.dict()}
     )