diff --git a/FCLauncher/assets/CityBase.png b/FCLauncher/assets/CityBase.png
new file mode 100644
index 0000000..8b7479d
Binary files /dev/null and b/FCLauncher/assets/CityBase.png differ
diff --git a/FCLauncher/assets/Title.png b/FCLauncher/assets/Title.png
new file mode 100644
index 0000000..a0593e0
Binary files /dev/null and b/FCLauncher/assets/Title.png differ
diff --git a/FCLauncher/src-tauri/tauri.conf.json b/FCLauncher/src-tauri/tauri.conf.json
index ba3f5a5..88b914b 100644
--- a/FCLauncher/src-tauri/tauri.conf.json
+++ b/FCLauncher/src-tauri/tauri.conf.json
@@ -19,8 +19,8 @@
     "windows": [
       {
         "title": "fclauncher",
-        "width": 800,
-        "height": 600
+        "width": 1280,
+        "height": 720
       }
     ],
     "security": {
diff --git a/FCLauncher/src/assets/CityBase.png b/FCLauncher/src/assets/CityBase.png
new file mode 100644
index 0000000..8b7479d
Binary files /dev/null and b/FCLauncher/src/assets/CityBase.png differ
diff --git a/FCLauncher/src/assets/Title.png b/FCLauncher/src/assets/Title.png
new file mode 100644
index 0000000..a0593e0
Binary files /dev/null and b/FCLauncher/src/assets/Title.png differ
diff --git a/FCLauncher/src/index.html b/FCLauncher/src/index.html
index b28fa23..58af275 100644
--- a/FCLauncher/src/index.html
+++ b/FCLauncher/src/index.html
@@ -8,49 +8,26 @@
     <script type="module" src="/main.js" defer></script>
   </head>
 
+  <style>
+    body {
+      background-image: src="assets/CityBase.png";
+    }
+    </style> 
+
   <body onload="load();">
+    
+    
     <div class="container">
-      <h1>Welcome to Tauri!</h1>
 
-      <div class="row">
-        <a href="https://tauri.app" target="_blank">
-          <img src="/assets/tauri.svg" class="logo tauri" alt="Tauri logo" />
-        </a>
-        <a
-          href="https://developer.mozilla.org/en-US/docs/Web/JavaScript"
-          target="_blank"
-        >
-          <img
-            src="/assets/javascript.svg"
-            class="logo vanilla"
-            alt="JavaScript logo"
-          />
-        </a>
-      </div>
+       
+
+      <img src="assets/Title.png" alt="Title">
       
-    <div class="dropdown">
-      <button onclick="packSelect()" class="dropbtn">Dropdown</button>
-      <div id="myDropdown" class="dropdown-content">
-        <a href="#">Pack 1</a>
-        <a href="#">Pack 2</a>
-        <a href="#">Pack 3</a>
-      </div>
-    </div>
+    
 
-    <select name="cars" id="Modpacks">
-      <option value="volvo">Volvo</option>
-      <option value="saab">Saab</option>
-      <option value="mercedes">Mercedes</option>
-      <option value="audi">Audi</option>
-    </select>
-      <p>Click on the Tauri logo to learn more about the framework</p>
-
-      <form class="row" id="greet-form">
-        <input id="greet-input" placeholder="Enter a name..." />
-        <button type="submit">Greet</button>
-      </form>
-
-      <p id="greet-msg"></p>
+      <select name="modSelect" id="Modpacks">
+      </select>
+      
     </div>
   </body>
 </html>
diff --git a/FCLauncher/src/main.js b/FCLauncher/src/main.js
index 3d65437..c5d1047 100644
--- a/FCLauncher/src/main.js
+++ b/FCLauncher/src/main.js
@@ -39,10 +39,14 @@ window.onload = async function() {
 
 function addModpacks(modpacks) {
   var dropdown = document.getElementById("Modpacks");
-  var opt = document.createElement("option"); 
-  opt.text = modpacks[0];
-  opt.value = 'somethings value';
-  dropdown.options.add(opt);
+  modpacks.sort();
+  modpacks.reverse();
+  for (let i = 0; i < modpacks.length; i++){
+    var opt = document.createElement("option"); 
+    opt.text = modpacks[i];
+    opt.value = 'somethings value';
+    dropdown.options.add(opt);
+  }
 }
   
 
diff --git a/FCLauncher/src/styles.css b/FCLauncher/src/styles.css
index 10be213..0362200 100644
--- a/FCLauncher/src/styles.css
+++ b/FCLauncher/src/styles.css
@@ -19,13 +19,17 @@
 
 .container {
   margin: 0;
-  padding-top: 10vh;
+  padding-top: 5vh;
   display: flex;
   flex-direction: column;
   justify-content: center;
   text-align: center;
 }
 
+body {
+  background-image: url('assets/CityBase.png');
+}
+
 .logo {
   height: 6em;
   padding: 1.5em;
@@ -149,3 +153,13 @@ button {
 .show {display:block;}
 
 }
+#Modpacks{
+  width:300px ;
+  align-content: center;
+  align-self: center;
+  align-items: center;
+}
+#Logo{
+  display: flex;
+  justify-content: center;
+}
