diff --git a/app/views/email_settings/index.html.erb b/app/views/email_settings/index.html.erb
index 7c2a47aa..0df5646e 100644
--- a/app/views/email_settings/index.html.erb
+++ b/app/views/email_settings/index.html.erb
@@ -33,10 +33,8 @@
           <%= ff.email_field :from_email, value: value['from_email'], required: true, class: 'base-input' %>
         </div>
       <% end %>
-      <div>
-        <div class="form-control mt-8">
-          <%= f.button button_title, class: 'base-button' %>
-        </div>
+      <div class="form-control">
+        <%= f.button button_title, class: 'base-button' %>
       </div>
     <% end %>
   </div>
diff --git a/app/views/profile/index.html.erb b/app/views/profile/index.html.erb
index 5dc63779..67612ea6 100644
--- a/app/views/profile/index.html.erb
+++ b/app/views/profile/index.html.erb
@@ -26,7 +26,7 @@
           <%= ff.text_field :name, required: true, class: 'base-input' %>
         </div>
       <% end %>
-      <div class="form-control mt-8">
+      <div class="form-control">
         <%= f.button button_title, class: 'base-button' %>
       </div>
     <% end %>
@@ -40,7 +40,7 @@
         <%= f.label :password_confirmation, 'Confirm new password', class: 'label' %>
         <%= f.password_field :password_confirmation, autocomplete: 'off', class: 'base-input' %>
       </div>
-      <div class="form-control mt-8">
+      <div class="form-control">
         <%= f.button button_title, class: 'base-button' %>
       </div>
     <% end %>
diff --git a/app/views/storage_settings/_azure_form.html.erb b/app/views/storage_settings/_azure_form.html.erb
new file mode 100644
index 00000000..1e2a7bea
--- /dev/null
+++ b/app/views/storage_settings/_azure_form.html.erb
@@ -0,0 +1,19 @@
+ <%= f.fields_for :value do |ff| %>
+  <%= ff.hidden_field :service, value: 'azure' %>
+  <%= ff.fields_for :configs, configs do |fff| %>
+    <div class="grid md:grid-cols-2 gap-4">
+      <div class="form-control">
+        <%= fff.label :storage_account_name, 'Storage Account Name', class: 'label' %>
+        <%= fff.text_field :storage_account_name, value: configs['storage_account_name'], required: true, class: 'base-input' %>
+      </div>
+      <div class="form-control">
+        <%= fff.label :container, class: 'label' %>
+        <%= fff.text_field :container, value: configs['container'], required: true , class: 'base-input' %>
+      </div>
+    </div>
+    <div class="form-control">
+      <%= fff.label :storage_access_key, 'Storage Access Key', class: 'label' %>
+      <%= fff.text_field :storage_access_key, value: configs['storage_access_key'], required: true, class: 'base-textarea' %>
+    </div>
+  <% end %>
+<% end %>
diff --git a/app/views/storage_settings/_google_cloud.html.erb b/app/views/storage_settings/_google_cloud_form.html.erb
similarity index 100%
rename from app/views/storage_settings/_google_cloud.html.erb
rename to app/views/storage_settings/_google_cloud_form.html.erb
diff --git a/app/views/storage_settings/index.html.erb b/app/views/storage_settings/index.html.erb
index 841bac56..08b399f3 100644
--- a/app/views/storage_settings/index.html.erb
+++ b/app/views/storage_settings/index.html.erb
@@ -8,25 +8,30 @@
     <% value = @encrypted_config.value || { 'service' => 'disk' } %>
     <% configs = value['configs'] || {} %>
     <%= form_for @encrypted_config, url: settings_storage_index_path, method: :post, html: { autocomplete: 'off', class: 'w-full' } do |f| %>
-      <% options = [['Disk', 'disk'], ['AWS S3', 'aws_s3'], ['Google Cloud', 'google']] %>
+      <% options = [['Disk', 'disk'], ['AWS S3', 'aws_s3'], ['Google Cloud', 'google'], ['Azure', 'azure']] %>
       <toggle-visible data-element-ids="<%= options.map(&:last).to_json %>" class="block relative">
-        <div class="flex space-x-2 relative">
+        <ul class="items-center w-full text-sm font-medium text-gray-900 space-y-2 sm:space-y-0 sm:flex sm:space-x-2">
           <% options.each do |(label, val)| %>
-            <%= f.label :selected, value: val, class: 'w-full flex flex-1 items-center space-x-2 btn btn-outline rounded-xl' do %>
-              <%= f.radio_button :selected, val, checked: value['service'] == val, data: { action: 'change:toggle-visible#trigger' }, class: 'base-radio' %>
-              <span><%= label %></span>
-            <% end %>
+            <li class="w-full border border-neutral-focus rounded-xl hover:bg-neutral hover:text-white">
+              <div class="flex items-center pl-3">
+                <%= f.radio_button :selected, val, checked: value['service'] == val, data: { action: 'change:toggle-visible#trigger' }, class: 'base-radio' %>
+                <%= f.label :selected, label, value: val, class: 'w-full py-3 ml-2 text-sm font-medium' %>
+              </div>
+            </li>
           <% end %>
-        </div>
+        </ul>
       </toggle-visible>
-      <disable-hidden id="disk" class="<%= 'block my-4 hidden' if value['service'] != 'disk' %>">
+      <disable-hidden id="disk" class="block my-4 <%= 'hidden' if value['service'] != 'disk' %>">
         <%= render "disk_form", f: f %>
       </disable-hidden>
-      <disable-hidden id="aws_s3" class="<%= 'block my-4 hidden' if value['service'] != 'aws_s3' %>">
+      <disable-hidden id="aws_s3" class="block my-4 <%= 'hidden' if value['service'] != 'aws_s3' %>">
         <%= render "aws_form", f: f, configs: configs, value: value %>
       </disable-hidden>
-      <disable-hidden id="google" class="<%= 'block my-4 hidden' if value['service'] != 'google' %>">
-        <%= render "google_cloud", f: f, configs: configs, value: value %>
+      <disable-hidden id="google" class="block my-4 <%= 'hidden' if value['service'] != 'google' %>">
+        <%= render "google_cloud_form", f: f, configs: configs, value: value %>
+      </disable-hidden>
+      <disable-hidden id="azure" class="block my-4 <%= 'hidden' if value['service'] != 'azure' %>">
+        <%= render "azure_form", f: f, configs: configs, value: value %>
       </disable-hidden>
       <div class="form-control">
         <%= f.button button_title('OK'), class: 'base-button' %>
diff --git a/package.json b/package.json
index c1a9d53b..0296e59f 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "compression-webpack-plugin": "10.0.0",
     "css-loader": "^6.7.3",
     "css-minimizer-webpack-plugin": "^5.0.0",
-    "daisyui": "^3.0.17",
+    "daisyui": "^3.0.19",
     "mini-css-extract-plugin": "^2.7.5",
     "postcss": "^8.4.23",
     "postcss-import": "^15.1.0",
diff --git a/yarn.lock b/yarn.lock
index 10917004..e8510a87 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2296,10 +2296,10 @@ csstype@^3.1.1:
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b"
   integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==
 
-daisyui@^3.0.17:
-  version "3.0.17"
-  resolved "https://registry.yarnpkg.com/daisyui/-/daisyui-3.0.17.tgz#d060e03215c35817b03d38d6425a76b731a8d1b4"
-  integrity sha512-TgdoCeQ0YBVwOWVhbfj0NIcV0nBEDKvkMisRplHM1NfJ4wyRH/Gj+c1iICBkckOLB7C/qLueBnJ2pPWpO8/49w==
+daisyui@^3.0.19:
+  version "3.0.19"
+  resolved "https://registry.yarnpkg.com/daisyui/-/daisyui-3.0.19.tgz#49ddcb19e51643ee763f1aa346bf51e58c6d3886"
+  integrity sha512-hx3yQ0/Bmn+8OvnA0bayInfu+VjqM3wNNujEaTmnpQRM8p1cwFzcvBXtACNN5gBeEAF18iSBH3drz3wdZ1vCaw==
   dependencies:
     colord "^2.9"
     css-selector-tokenizer "^0.8"