diff --git a/main.js b/main.js
index e2c6236..59016bf 100644
--- a/main.js
+++ b/main.js
@@ -199,3 +199,9 @@ ipcMain.on('select-folder', (event) => {
     console.log(err);
   });
 });
+
+ipcMain.on('start-sync', (event, config) => {
+  console.log('Starting sync with config:', config);
+  // Here you can implement the sync logic using the config.destFolder 
+  // and config.onedriveSource parameters
+});
diff --git a/renderer/config.html b/renderer/config.html
deleted file mode 100644
index 59907ca..0000000
--- a/renderer/config.html
+++ /dev/null
@@ -1,42 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Configuration</title>
-</head>
-<body>
-  <h1>Configuration</h1>
-  <form id="config-form">
-    <div>
-      <label for="dest-folder">Destination Folder for Photo Sync:</label>
-      <input type="text" id="dest-folder" name="dest-folder" readonly>
-      <button type="button" id="select-folder">Select Folder</button>
-    </div>
-    <div>
-      <label for="onedrive-source">OneDrive Source Path:</label>
-      <input type="text" id="onedrive-source" name="onedrive-source">
-    </div>
-    <button type="submit">Save</button>
-  </form>
-
-  <script>
-    const { ipcRenderer } = require('electron');
-
-    document.getElementById('select-folder').addEventListener('click', () => {
-      ipcRenderer.send('select-folder');
-    });
-
-    ipcRenderer.on('folder-selected', (event, path) => {
-      document.getElementById('dest-folder').value = path;
-    });
-
-    document.getElementById('config-form').addEventListener('submit', (event) => {
-      event.preventDefault();
-      const destFolder = document.getElementById('dest-folder').value;
-      const onedriveSource = document.getElementById('onedrive-source').value;
-      ipcRenderer.send('set-config', { destFolder, onedriveSource });
-    });
-  </script>
-</body>
-</html>
\ No newline at end of file
diff --git a/renderer/index.html b/renderer/index.html
index 9f616bf..5946fae 100644
--- a/renderer/index.html
+++ b/renderer/index.html
@@ -37,6 +37,9 @@
 
         <button type="submit" class="submit-button">Save Changes</button>
       </form>
+      
+      <button id="sync-button">Sync Now</button>
+
     </div>
   </div>
 
diff --git a/renderer/renderer.js b/renderer/renderer.js
index 7e2aaaf..687b25e 100644
--- a/renderer/renderer.js
+++ b/renderer/renderer.js
@@ -65,6 +65,18 @@ document.getElementById('config-form').addEventListener('submit', (event) => {
   console.log('Configuration panel closed');
 });
 
+document.getElementById('sync-button').addEventListener('click', () => {
+  const destFolder = document.getElementById('dest-folder').value;
+  const onedriveSource = document.getElementById('onedrive-source').value;
+  
+  if (!destFolder || !onedriveSource) {
+    alert('Please set both destination folder and OneDrive source path first');
+    return;
+  }
+
+  ipcRenderer.send('start-sync', { destFolder, onedriveSource });
+});
+
 // Config loaded handler
 ipcRenderer.on('config-loaded', (event, config) => {
   console.log('Received saved configuration:', config);
@@ -107,4 +119,5 @@ function createStatusDisplay() {
 document.getElementById('close-config').addEventListener('click', () => {
   console.log('Close button clicked');
   document.getElementById('config-panel').classList.remove('open');
-});
\ No newline at end of file
+});
+
diff --git a/renderer/styles.css b/renderer/styles.css
index 43be84f..2748536 100644
--- a/renderer/styles.css
+++ b/renderer/styles.css
@@ -218,3 +218,26 @@ body {
   70% { opacity: 1; }
   100% { opacity: 0; }
 }
+
+/* Sync Button */
+#sync-button {
+  width: 100%;
+  background: #0078d4;
+  color: white;
+  border: none;
+  padding: 10px 24px;
+  border-radius: 4px;
+  font-size: 14px;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background 0.2s;
+  margin-top: 16px;
+}
+
+#sync-button:hover {
+  background: #106ebe;
+}
+
+#sync-button:active {
+  background: #005a9e;
+}
