diff --git a/.idea/dataSources.local.xml b/.idea/dataSources.local.xml
new file mode 100644
index 0000000000000000000000000000000000000000..e755e679ce00c128aff9b96ca28777b14aadabf4
--- /dev/null
+++ b/.idea/dataSources.local.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="dataSourceStorageLocal" created-in="IU-223.8214.52">
+    <data-source name="test" uuid="fb83df88-3d7b-4d57-9618-98d315da7e92">
+      <database-info product="" version="" jdbc-version="" driver-name="" driver-version="" dbms="SQLITE" exact-version="0" />
+      <schema-mapping />
+    </data-source>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/dbnavigator.xml b/.idea/dbnavigator.xml
index 5e4e624951e499268d9eb4bf62f0dd0c73bb4c8f..86c6e62890705435a3c8a4f20583c22be3a90815 100644
--- a/.idea/dbnavigator.xml
+++ b/.idea/dbnavigator.xml
@@ -16,6 +16,9 @@
   <component name="DBNavigator.Project.DatabaseFileManager">
     <open-files />
   </component>
+  <component name="DBNavigator.Project.ExecutionManager">
+    <retain-sticky-names value="false" />
+  </component>
   <component name="DBNavigator.Project.ObjectQuickFilterManager">
     <last-used-operator value="EQUAL" />
     <filters />
diff --git a/app/build.gradle b/app/build.gradle
index 7ef02b6b26f539fe28c064fc851f74fd2fa60e8d..5549c6d4413fa0225c8fb7fe6885e7a047a0428b 100644
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -25,7 +25,7 @@ dependencies {
     implementation project(':utilities')
     testImplementation 'org.jetbrains.kotlin:kotlin-test'
 
-    implementation 'org.xerial:sqlite-jdbc:3.30.1'
+    implementation 'org.xerial:sqlite-jdbc:3.39.3.0'
 
     implementation("org.slf4j:slf4j-simple:1.6.1")
 
diff --git a/app/src/main/kotlin/notes/multi/app/App.kt b/app/src/main/kotlin/notes/multi/app/App.kt
index 075c9c3901763a75438d9b7aecc13dea88f45e26..642591831c44e510a1ac70fc9f3fdb1af79b1cc2 100644
--- a/app/src/main/kotlin/notes/multi/app/App.kt
+++ b/app/src/main/kotlin/notes/multi/app/App.kt
@@ -8,15 +8,59 @@ import javafx.application.Application
 import notes.multi.utilities.DatabaseOperations
 import notes.multi.utilities.Note
 import org.jetbrains.exposed.sql.Database
-import org.jetbrains.exposed.sql.SchemaUtils
-import org.jetbrains.exposed.sql.transactions.transaction
-import java.time.LocalDate
-import java.time.LocalDateTime
-import javax.xml.crypto.Data
 import notes.multi.utilities.TextWindow
+import java.lang.IllegalArgumentException
 
-
-fun main() {
+fun main(args: Array<String>) {
     Database.connect("jdbc:sqlite:test.db")
-    Application.launch(TextWindow()::class.java)
-}
+
+    try {
+        if (args.isEmpty()) {
+            Application.launch(TextWindow()::class.java)
+        } else if (args.size == 1) {
+            val notesList: MutableList<Note> = DatabaseOperations.getAllNotes()
+
+            if (args[0] == "help") {
+                println(
+                    """
+        +-------------------------------------------------------------------------------------+
+        WELCOME TO TEAM 112'S CONSOLE BASED NOTES APP
+         
+        This application is a working console-based prototype for the
+        note taking application that the team will be delivering at the end of the term.
+        
+        With this simple app, users can:
+            1. Create Notes
+            2. Edit Notes
+            3. Delete Notes
+            4. Close GUI Window
+            
+         To access the app through the command line, simply run ./app <ARG>
+         
+         The value of <ARG> can be:
+            - help: To view the info of the app and list of all notes 
+            - Note ID: ID of the target note that is intended to be opened
+       
+        +-------------------------------------------------------------------------------------+
+    """.trimIndent()
+                )
+                for (note in notesList) {
+                    println("${note.id} | ${note.title} | ${note.lastModified}")
+                }
+            } else {
+                var noteId = args[0]
+                notesList.find { it.id == noteId } ?:
+                    throw IllegalArgumentException("[ERROR]: Invalid Note ID!")
+                Application.launch(TextWindow()::class.java, "--note=${noteId}")
+            }
+        } else {
+            if (args.size > 1) {
+                throw IllegalArgumentException("[ERROR]: Wrong number of arguments provided!")
+            }
+        }
+    } catch (err: IllegalArgumentException) {
+        System.err.println(err.message)
+        System.err.println("This app only expects one argument: 'help' or ID of a note.")
+        System.err.println("To view a list of all local notes that can be opened via the command line, please use the 'help' argument")
+    }
+}
\ No newline at end of file
diff --git a/app/test.db b/app/test.db
index bdc10314bc8428fe267b386cba48ea35a18a0c03..3486fba3e8a74c9a3ff33e2ca74afec971dbae2a 100644
Binary files a/app/test.db and b/app/test.db differ
diff --git a/utilities/build.gradle b/utilities/build.gradle
index c85441609fc9b8d537ba3b58fa92e9441db09630..99f336808cce255580f8ab18113689dd6d3e6c84 100644
--- a/utilities/build.gradle
+++ b/utilities/build.gradle
@@ -31,6 +31,8 @@ dependencies {
     implementation("org.jetbrains.exposed:exposed-dao:0.40.1")
     implementation("org.jetbrains.exposed:exposed-jdbc:0.40.1")
     implementation ("com.beust:klaxon:5.5")
+    implementation ('com.squareup.okhttp3:okhttp:4.10.0')
+
 }
 
 test {
diff --git a/utilities/src/main/kotlin/notes/multi/utilities/DatabaseOperations.kt b/utilities/src/main/kotlin/notes/multi/utilities/DatabaseOperations.kt
index fae37b079658fcef7dbda479b2df8306884b9745..25459bfc90637dc692a1cf82544b1615b7a2e08d 100644
--- a/utilities/src/main/kotlin/notes/multi/utilities/DatabaseOperations.kt
+++ b/utilities/src/main/kotlin/notes/multi/utilities/DatabaseOperations.kt
@@ -196,11 +196,13 @@ class DatabaseOperations() {
             addUpdateNote(note)
         }
 
-        fun localfetch(note: Note) {
+        fun localfetch(note: Note): Boolean {
             val ret = HttpOperations.get(note.id)
             if (ret.id != "NOT_FOUND") {
                 addUpdateNote(ret)
+                return true
             }
+            return false
         }
 
         // Delete from remote
diff --git a/utilities/src/main/kotlin/notes/multi/utilities/GUInote.kt b/utilities/src/main/kotlin/notes/multi/utilities/GUInote.kt
index 0f04bad20757406e480201479e67084d82dadda5..d95633458cb55cf9d3ff3b982080e7851de5fa3f 100644
--- a/utilities/src/main/kotlin/notes/multi/utilities/GUInote.kt
+++ b/utilities/src/main/kotlin/notes/multi/utilities/GUInote.kt
@@ -39,7 +39,7 @@ class GUInote {
         for (i in notescenes) {
             if (i.file().id == noteid) {
                 i.retstage().requestFocus()
-                println(i.retstage().isFocused)
+                // println(i.retstage().isFocused)
                 i.retstage().toFront()
             }
         }
diff --git a/utilities/src/main/kotlin/notes/multi/utilities/NoteTextWindow.kt b/utilities/src/main/kotlin/notes/multi/utilities/NoteTextWindow.kt
index 04dcebe3a7bd0dda8b37c651cad810bc4175d90e..e4ff217c688e57b00c8a63cf671145ac018d3a27 100644
--- a/utilities/src/main/kotlin/notes/multi/utilities/NoteTextWindow.kt
+++ b/utilities/src/main/kotlin/notes/multi/utilities/NoteTextWindow.kt
@@ -1,5 +1,6 @@
 package notes.multi.utilities
 
+import com.beust.klaxon.Klaxon
 import javafx.application.Application
 import javafx.stage.Stage
 import javafx.scene.Scene
@@ -46,11 +47,7 @@ class TextWindow(): Application() {
 
     override fun start(stage: Stage) {
         val noteslist = GUInote()
-        val newwindow = notescene(stage, noteslist,0 )
-        if (paramsMap.isNotEmpty()) {
-            newwindow.settitle(paramsMap["title"]!!)
-            newwindow.settext(paramsMap["text"]!!)
-            newwindow.setnewname(false)
-        }
+        val noteId = if (paramsMap.containsKey("note")) paramsMap["note"]!! else "-1"
+        val newwindow = notescene(stage, noteslist, noteId)
     }
 }
\ No newline at end of file
diff --git a/utilities/src/main/kotlin/notes/multi/utilities/Themes.kt b/utilities/src/main/kotlin/notes/multi/utilities/Themes.kt
new file mode 100644
index 0000000000000000000000000000000000000000..89eec603c1cf6301fd39b01a855e9010c1fcb10a
--- /dev/null
+++ b/utilities/src/main/kotlin/notes/multi/utilities/Themes.kt
@@ -0,0 +1,58 @@
+package notes.multi.utilities
+
+import javafx.application.Application
+import javafx.scene.Scene
+import javafx.stage.Stage
+import javafx.geometry.Pos
+import javafx.scene.control.Button
+import javafx.scene.control.Label
+import javafx.scene.layout.StackPane
+import javafx.scene.layout.VBox
+import javafx.scene.paint.Color
+import javafx.scene.text.Font
+import javafx.scene.web.HTMLEditor
+import javafx.scene.web.WebView
+import javax.swing.text.html.StyleSheet
+
+fun toggleDarkMode(scene: Scene, editor: HTMLEditor, isDarkMode: Boolean) {
+    //val darktheme: StyleSheet = StyleSheet(false, "notes/multi/utilities/darktheme.css")
+
+    if (isDarkMode) {
+        //note.text.toString(). = Color.WHITE
+        //scene.root.style = "-fx-background-color: ${Color.BLACK.toString().replace("0x", "#")}; -fx-text-fill: ${Color.WHITE.toString().replace("0x", "#")}"
+        editor.style = "-fx-background-color: white;"
+        editor.htmlText = "<body style='background-color: white;'" + editor.htmlText
+        scene.stylesheets.remove("darktheme.css")
+    } else {
+        //note.text = Color.BLACK
+        //scene.root.style = "-fx-background-color: ${Color.WHITE.toString().replace("0x", "#")}; -fx-text-fill: ${Color.BLACK.toString().replace("0x", "#")}"
+        editor.htmlText = "<body style='background-color: #121212;'" + editor.htmlText
+        editor.style = "-fx-background-color: #121212;"
+        scene.stylesheets.add("darktheme.css")
+
+
+    }
+    //isDarkMode = !isDarkMode
+}
+
+fun addNewDarkMode(scene: Scene, editor: HTMLEditor) {
+        editor.htmlText = "<body style='background-color: #black;'" + editor.htmlText
+        editor.style = "-fx-background-color: #black;"
+        scene.stylesheets.add("newFile.css")
+
+}
+
+fun removeDarkMode(scene: Scene, editor: HTMLEditor){
+    editor.style = "-fx-background-color: white;"
+    editor.htmlText = "<body style='background-color: white;'" + editor.htmlText
+    scene.stylesheets.remove("newFile.css")
+}
+fun addDarkModeBrowser(scene: Scene) {
+        scene.stylesheets.add("darkthemeBrowser.css")
+    //isDarkMode = !isDarkMode
+}
+
+fun removeDarkModeBrowser(scene: Scene) {
+    scene.stylesheets.remove("darkthemeBrowser.css")
+    //isDarkMode = !isDarkMode
+}
\ No newline at end of file
diff --git a/utilities/src/main/kotlin/notes/multi/utilities/notescene.kt b/utilities/src/main/kotlin/notes/multi/utilities/notescene.kt
index bb71ff45c844b3dc1089a15781e9a511616717bc..72f43bab3f2107bf3ce2e902aa5e8a30739eeae8 100644
--- a/utilities/src/main/kotlin/notes/multi/utilities/notescene.kt
+++ b/utilities/src/main/kotlin/notes/multi/utilities/notescene.kt
@@ -5,16 +5,25 @@ import javafx.collections.FXCollections
 import javafx.scene.Scene
 import javafx.scene.control.*
 import javafx.scene.input.KeyCode
-import javafx.scene.layout.AnchorPane
-import javafx.scene.layout.HBox
-import javafx.scene.layout.Priority
-import javafx.scene.layout.VBox
+import javafx.scene.layout.*
 import javafx.scene.web.HTMLEditor
+import javafx.stage.FileChooser
 import javafx.stage.Modality
 import javafx.stage.Stage
+import okhttp3.MediaType.Companion.toMediaTypeOrNull
+import okhttp3.MultipartBody
+import okhttp3.OkHttpClient
+import okhttp3.Request
+import okhttp3.RequestBody.Companion.asRequestBody
+import java.io.File
 import java.time.LocalDateTime
+import java.util.*
 
-class notescene(private val stage: Stage, private val lists:GUInote, private val id:Int) {
+// http://18.117.170.43:8080/notes-app-images/images/
+// http://localhost:8080/images/
+const val IMAGE_MICROSERVICE = "http://18.117.170.43:8080/notes-app-images/images/"
+
+class notescene(private val stage: Stage, private val lists:GUInote, private val id: String = "-1") {
     /**
      * Boolean value denoting whether console has been pressed
      */
@@ -22,6 +31,7 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
 
     private var newname = true
     private var curfile = Note()
+    private var isDarkMode = false
     private var textarea = HTMLEditor()
 
     fun file() :Note{
@@ -38,13 +48,22 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
 
 
     init {
+
+
+        if (id != "-1") {
+            curfile = DatabaseOperations.getNote(id)
+            textarea.htmlText = curfile.text.toString()
+            newname = false
+        }
+
         lists.addstage(this)
 
         stage.setOnCloseRequest {
             lists.removenote(curfile.id)
             lists.removestage(this)
         }
-        stage.title = "Untitled"
+        stage.title = if (id != "-1") curfile.title else "Untitled"
+
         val scroll = ScrollPane()
         val anchor = AnchorPane(textarea)
 
@@ -69,28 +88,32 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
 
         val menubar = MenuBar()
         val filemenu = Menu("File")
+        val insertmenu = Menu("Insert")
         val modechange = Menu("Mode")
         val sync = Menu("Sync")
 
         // File menu items
         val new = MenuItem("New")
-        val open = MenuItem("OpenLocal")
-        val openserver = MenuItem("OpenServer")
+        val open = MenuItem("Local Notes")
+        val openserver = MenuItem("Remote Notes")
         val save = MenuItem("Save")
         val rename = MenuItem("Rename")
         val delete = MenuItem("Delete")
 
+        //Insert menu items
+        val insertimage = MenuItem("Insert Image")
+
         // Modechange menu items
         val dark = MenuItem("Dark")
         val light = MenuItem("Light")
 
         // option menu items
-        val update = MenuItem("update")
-        val fetch = MenuItem("fetch")
+        val update = MenuItem("Update Remote")
+        val fetch = MenuItem("Fetch Remote")
 
         new.setOnAction {
             val newwindow = Stage()
-            notescene(newwindow, lists, id+1)
+            notescene(newwindow, lists, "-1")
         }
 
 
@@ -119,6 +142,11 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                     if (index != -1) {
                         if (event.clickCount == 2) {
                             if (lists.findopened(obsfs[index].id)) {
+                                if(isDarkMode){
+                                    //textarea.stylesheets.add("newFile.css")
+                                    toggleDarkMode(stage.scene, textarea, isDarkMode)
+                                    isDarkMode = !isDarkMode
+                                }
                                 browser.close()
                                 lists.focusstage(obsfs[index].id)
                             } else {
@@ -143,6 +171,10 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                     val index = notesview.selectionModel.selectedIndex
                     if (index != -1) {
                         if (lists.findopened(obsfs[index].id)) {
+                            if (isDarkMode) {
+                                toggleDarkMode(stage.scene, textarea, isDarkMode)
+                                isDarkMode = !isDarkMode
+                            }
                             browser.close()
                             lists.focusstage(obsfs[index].id)
                         } else {
@@ -167,11 +199,25 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                             val warning = Alert(Alert.AlertType.ERROR)
                             warning.title = "ERROR"
                             warning.contentText = "This file is opened in program"
+                            // val dialogPane: DialogPane = warning.dialogPane
+                            // if (isDarkMode) {
+                            //     dialogPane.stylesheets.add("alertStylesheet.css")
+                            // } else {
+                            //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                            // }
+
                             warning.showAndWait()
                         } else {
                             val warningdel = Alert(Alert.AlertType.CONFIRMATION)
                             warningdel.title = "DELETE"
                             warningdel.contentText = "Do you delete this file?"
+                            // val dialogPane: DialogPane = warningdel.dialogPane
+                            // if (isDarkMode) {
+                            //     dialogPane.stylesheets.add("alertStylesheet.css")
+                            // } else {
+                            //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                            // }
+
                             val result = warningdel.showAndWait()
                             if (result.isPresent) {
                                 when (result.get()) {
@@ -191,6 +237,12 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 VBox.setVgrow(notesview, Priority.ALWAYS)
                 browser.scene = Scene(generalcontainer)
 
+                if (isDarkMode) {
+                    addDarkModeBrowser(browser.scene)
+                } else {
+                    removeDarkModeBrowser(browser.scene)
+                }
+
                 browser.show()
 
                 browser.setOnCloseRequest {
@@ -200,6 +252,14 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.ERROR)
                 warning.title = "ERROR"
                 warning.contentText = "The file browser is opened elsewhere"
+
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 warning.showAndWait()
             }
         }
@@ -218,6 +278,12 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                     val interneterror = Alert(Alert.AlertType.ERROR)
                     interneterror.title = "ERROR: NO INTERNET"
                     interneterror.contentText = "There is no internet to connect server"
+                    // val dialogPane: DialogPane = interneterror.dialogPane
+                    // if (isDarkMode) {
+                    //     dialogPane.stylesheets.add("alertStylesheet.css")
+                    // } else {
+                    //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                    // }
                     interneterror.showAndWait()
                     browser.close()
                     lists.setbrowseropened(false)
@@ -241,6 +307,11 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                     val index = notesview.selectionModel.selectedIndex
                     if (index != -1) {
                         DatabaseOperations.remotefetch(obsfs[index])
+                        if (isDarkMode) {
+                            //textarea.stylesheets.add("newFile.css")
+                            toggleDarkMode(stage.scene, textarea, isDarkMode)
+                            isDarkMode = !isDarkMode
+                        }
                         lists.update()
                     }
                     val success = Alert(Alert.AlertType.INFORMATION)
@@ -257,6 +328,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                         val warningdel = Alert(Alert.AlertType.CONFIRMATION)
                         warningdel.title = "DELETE"
                         warningdel.contentText = "Do you delete this file?"
+                        // val dialogPane: DialogPane = warningdel.dialogPane
+                        // if (isDarkMode) {
+                        //     dialogPane.stylesheets.add("alertStylesheet.css")
+                        // } else {
+                        //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                        // }
+
                         val result = warningdel.showAndWait()
                         if (result.isPresent) {
                             when (result.get()) {
@@ -274,6 +352,11 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val generalcontainer = VBox(notesview, buttoncontainer)
                 VBox.setVgrow(notesview, Priority.ALWAYS)
                 browser.scene = Scene(generalcontainer)
+                if (isDarkMode) {
+                    addDarkModeBrowser(browser.scene)
+                } else {
+                    removeDarkModeBrowser(browser.scene)
+                }
 
                 browser.show()
 
@@ -282,6 +365,12 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 }
             } else {
                 val warning = Alert(Alert.AlertType.ERROR)
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
                 warning.title = "ERROR"
                 warning.contentText = "The file browser is opened elsewhere"
                 warning.showAndWait()
@@ -292,6 +381,18 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
             val warning = Alert(Alert.AlertType.CONFIRMATION)
             warning.title = "SAVE"
             warning.contentText = "Do you want to save this file?"
+
+            // val dialogPane: DialogPane = warning.dialogPane
+            //
+            // if(isDarkMode){
+            //     dialogPane.stylesheets.add("alertStylesheet.css")
+            //    // dialogPane.style = "-fx-background-color: black; -fx-text-background-color: white; -"
+            //
+            // }else{
+            //     dialogPane.stylesheets.remove("alertStylesheet.css")
+            //    // dialogPane.style = "-fx-background-color: white; -fx-text-background-color: black;"
+            // }
+
             val result = warning.showAndWait()
             if (result.isPresent) {
                 when (result.get()) {
@@ -300,12 +401,25 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                             while(true) {
                                 val renaming = TextInputDialog()
                                 renaming.headerText = "Enter new name"
+                                // if (isDarkMode) {
+                                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                                // } else {
+                                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                                // }
+
                                 val result = renaming.showAndWait()
                                 if (result.isPresent) {
                                     if (renaming.editor.text == "") {
                                         val warning = Alert(Alert.AlertType.ERROR)
                                         warning.title = "ERROR"
                                         warning.contentText = "Empty can't be filename"
+                                        // val dialogPane: DialogPane = warning.dialogPane
+                                        // if (isDarkMode) {
+                                        //     dialogPane.stylesheets.add("alertStylesheet.css")
+                                        // } else {
+                                        //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                                        // }
+
                                         warning.showAndWait()
                                     } else {
                                         stage.title = renaming.editor.text
@@ -340,6 +454,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                         val warning = Alert(Alert.AlertType.ERROR)
                         warning.title = "ERROR"
                         warning.contentText = "Empty can't be filename"
+                        // val dialogPane: DialogPane = warning.dialogPane
+                        // if (isDarkMode) {
+                        //     dialogPane.stylesheets.add("alertStylesheet.css")
+                        // } else {
+                        //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                        // }
+
                         warning.showAndWait()
                     } else {
                         stage.title = renaming.editor.text
@@ -359,6 +480,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.CONFIRMATION)
                 warning.title = "DELETE"
                 warning.contentText = "Do you delete this file?"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 val result = warning.showAndWait()
                 if (result.isPresent) {
                     when (result.get()) {
@@ -372,6 +500,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.ERROR)
                 warning.title = "ERROR"
                 warning.contentText = "The file browser is opened elsewhere"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 warning.showAndWait()
             }
         }
@@ -381,6 +516,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.CONFIRMATION)
                 warning.title = "UPDATE"
                 warning.contentText = "Do you want to update the file to server?"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 val result = warning.showAndWait()
                 if (result.isPresent) {
                     when (result.get()) {
@@ -391,6 +533,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                                     val warning = Alert(Alert.AlertType.ERROR)
                                     warning.title = "ERROR"
                                     warning.contentText = "Please save file locally before you upload."
+                                    // val dialogPane: DialogPane = warning.dialogPane
+                                    // if (isDarkMode) {
+                                    //     dialogPane.stylesheets.add("alertStylesheet.css")
+                                    // } else {
+                                    //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                                    // }
+
                                     warning.showAndWait()
                                 }
                             } catch (e: Exception) {
@@ -406,6 +555,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.ERROR)
                 warning.title = "ERROR"
                 warning.contentText = "The file browser is opened elsewhere"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 warning.showAndWait()
             }
         }
@@ -415,13 +571,21 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.CONFIRMATION)
                 warning.title = "FETCH"
                 warning.contentText = "Any unuploaded changes will be lost. Are you sure fetch?"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 val result = warning.showAndWait()
                 if (result.isPresent) {
                     when (result.get()) {
                         ButtonType.OK -> {
                             try {
-                                DatabaseOperations.localfetch(curfile)
-                                lists.update()
+                                if(DatabaseOperations.localfetch(curfile)) {
+                                    lists.update()
+                                }
                             } catch (e: Exception) {
                                 val interneterror = Alert(Alert.AlertType.ERROR)
                                 interneterror.title = "ERROR: NO INTERNET"
@@ -435,20 +599,93 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.ERROR)
                 warning.title = "ERROR"
                 warning.contentText = "The file browser is opened elsewhere"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 warning.showAndWait()
             }
         }
 
         filemenu.items.addAll(new, open, openserver ,save, rename, delete)
+        insertmenu.items.addAll(insertimage)
         modechange.items.addAll(dark, light)
         sync.items.addAll(update, fetch)
-        menubar.menus.addAll(filemenu, modechange, sync)
+        menubar.menus.addAll(filemenu, insertmenu, modechange, sync)
+
+        // adding images to the textarea
+        // val selectImageButton = Button("Select Image")
+
+        insertimage.setOnAction {
+            val filechooser = FileChooser()
+            filechooser.title = "Select Image"
+            filechooser.extensionFilters.addAll(
+                FileChooser.ExtensionFilter("Image Files", "*.png", "*.jpg", "*.gif", "*.jpeg")
+            )
+            val selectedImage = filechooser.showOpenDialog(null)
+            if (selectedImage != null) {
+                val imagePath = selectedImage.toURI().toString()
+                try {
+                    val responseIdx = sendImageToMicroservice(selectedImage)
+                    if (responseIdx < 0) { throw ErrorInUploadingFile("Failed to add image to database. Response Code: ${-responseIdx}.")}
+                    val imageHTML = "<img src=${IMAGE_MICROSERVICE}${responseIdx} style=\'width: 100%;\'>"
+                    textarea.htmlText += imageHTML
+                } catch (e: IllegalFileTypeUpload) {
+                    var warning = Alert(Alert.AlertType.ERROR)
+                    warning.title = "Illegal file type"
+                    warning.contentText = e.message
+                    warning.showAndWait()
+                } catch (e: ErrorInUploadingFile) {
+                    var warning = Alert(Alert.AlertType.ERROR)
+                    warning.title = "Error in file upload"
+                    warning.contentText = e.message
+                    warning.showAndWait()
+                }
+            }
+        }
+
+        //val image = textarea.lookup("#12345") as? WebView
+        //var startX = 0.0
+        //var startY = 0.0
+        //var startWidth = 0.0
+        //var startHeight = 0.0
+        //var isResizing = false
+
+        //image?.let { webView ->
+        //    val webEngine = webView.engine
+
+        //    webEngine.loadContent(textarea.htmlText)
+
+        //    val document = webEngine.document
+        //    val img = document.getElementById("12345")
+
+        //    img?.let { element ->
+        //        (element as HTMLElement).
+        //    }
+        //}
 
         val box = VBox(menubar, anchor)
         VBox.setVgrow(anchor, Priority.ALWAYS)
 
         stage.scene = Scene(box, 300.0, 300.0)
 
+        dark.setOnAction {
+            if (!isDarkMode) {
+                toggleDarkMode(stage.scene, textarea, isDarkMode)
+                isDarkMode = !isDarkMode
+            }
+        }
+
+        light.setOnAction {
+            if (isDarkMode) {
+                toggleDarkMode(stage.scene, textarea, isDarkMode)
+                isDarkMode = !isDarkMode
+            }
+        }
+
         /**
          * Logic for key presses:
          * - Save: Ctrl + S
@@ -461,6 +698,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
             } else if (event.code == KeyCode.S && controlPressed) {
                 controlPressed = false
                 val warning = Alert(Alert.AlertType.CONFIRMATION)
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 warning.title = "SAVE"
                 warning.contentText = "Do you want to save this file?"
                 val result = warning.showAndWait()
@@ -477,6 +721,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                                             val warning = Alert(Alert.AlertType.ERROR)
                                             warning.title = "ERROR"
                                             warning.contentText = "Empty can't be filename"
+                                            // val dialogPane: DialogPane = warning.dialogPane
+                                            // if (isDarkMode) {
+                                            //     dialogPane.stylesheets.add("alertStylesheet.css")
+                                            // } else {
+                                            //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                                            // }
+
                                             warning.showAndWait()
                                         } else {
                                             stage.title = renaming.editor.text
@@ -505,6 +756,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                     val warning = Alert(Alert.AlertType.CONFIRMATION)
                     warning.title = "DELETE"
                     warning.contentText = "Do you delete this file?"
+                    // val dialogPane: DialogPane = warning.dialogPane
+                    // if (isDarkMode) {
+                    //     dialogPane.stylesheets.add("alertStylesheet.css")
+                    // } else {
+                    //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                    // }
+
                     val result = warning.showAndWait()
                     if (result.isPresent) {
                         when (result.get()) {
@@ -529,6 +787,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                     val warning = Alert(Alert.AlertType.ERROR)
                     warning.title = "ERROR"
                     warning.contentText = "The file browser is opened elsewhere"
+                    // val dialogPane: DialogPane = warning.dialogPane
+                    // if (isDarkMode) {
+                    //     dialogPane.stylesheets.add("alertStylesheet.css")
+                    // } else {
+                    //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                    // }
+
                     warning.showAndWait()
                 }
             } else if (event.code == KeyCode.W && controlPressed) {
@@ -536,6 +801,13 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
                 val warning = Alert(Alert.AlertType.CONFIRMATION)
                 warning.title = "WARNING"
                 warning.contentText = "The current work will not be saved. Are you sure you want to quit?"
+                // val dialogPane: DialogPane = warning.dialogPane
+                // if (isDarkMode) {
+                //     dialogPane.stylesheets.add("alertStylesheet.css")
+                // } else {
+                //     dialogPane.stylesheets.remove("alertStylesheet.css")
+                // }
+
                 val result = warning.showAndWait()
                 if (result.isPresent) {
                     when (result.get()) {
@@ -554,6 +826,8 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
             if (controlPressed) {controlPressed = false}
         }
 
+        val wv = textarea.lookup("WebView")
+        GridPane.setVgrow(wv, Priority.ALWAYS)
 
         stage.show()
     }
@@ -569,4 +843,41 @@ class notescene(private val stage: Stage, private val lists:GUInote, private val
     fun setnewname(new: Boolean) {
         newname = new
     }
+
+    class IllegalFileTypeUpload (msg: String) : Exception(msg)
+    class ErrorInUploadingFile (msg: String) : Exception(msg)
+    private fun sendImageToMicroservice(selectedImage: File): Int {
+        val imgFile = File(selectedImage.toURI())
+
+        val contentType = when (imgFile.extension.lowercase(Locale.getDefault())) {
+            "jpeg", "jpg" -> "image/jpeg".toMediaTypeOrNull()
+            "png" -> "image/png".toMediaTypeOrNull()
+            "gif" -> "image/gif".toMediaTypeOrNull()
+            else -> throw IllegalFileTypeUpload("Only .jpeg, .jpg, .png, and .gif file formats are accepted!")
+        }
+
+        val requestBody = MultipartBody.Builder()
+            .setType(MultipartBody.FORM).addFormDataPart(
+                "image", imgFile.name,
+                imgFile.asRequestBody(contentType)
+            ).build()
+
+        val request = Request.Builder()
+            .url(IMAGE_MICROSERVICE)
+            .post(requestBody)
+            .build()
+
+        val res = OkHttpClient().newCall(request).execute()
+        var insertionIndex = -1
+        if (!res.isSuccessful) {
+            return -res.code
+        }
+
+        if (res.body != null) {
+            insertionIndex= res.body!!.string().toInt()
+        }
+        res.body?.close()
+
+        return insertionIndex
+    }
 }
\ No newline at end of file
diff --git a/utilities/src/main/resources/alertStylesheet.css b/utilities/src/main/resources/alertStylesheet.css
new file mode 100644
index 0000000000000000000000000000000000000000..1c2d2a37ce62ced87ad453fd7a0564012552ea2a
--- /dev/null
+++ b/utilities/src/main/resources/alertStylesheet.css
@@ -0,0 +1,61 @@
+dialog-pane {
+    -fx-background-color: black;
+    -fx-padding: 0;
+}
+
+.root{
+    -fx-text-background-color: #827e7e;
+}
+
+.dialog-pane:header .header-panel {
+    /*-fx-padding: 0.833em 1.166em 0.833em 1.166em; *//* 10px 14px 10px 14px */
+    -fx-padding: 0.833em; /* 10px */
+    -fx-background-color: black;
+    -fx-background-insets: 0, 0 0 1 0;
+}
+
+.dialog-pane:header .header-panel .label {
+    -fx-font-size: 1.167em; /* 14px */
+    -fx-wrap-text: true;
+}
+
+.dialog-pane:header .header-panel .graphic-container {
+    /* This prevents the text in the header running directly into the graphic */
+    -fx-padding: 0 0 0 0.833em; /* 0px 0px 0px 10px */
+}
+
+.dialog-pane > .button-bar > .container > .details-button {
+  -fx-alignment: baseline-left;
+  -fx-focus-traversable: false;
+  -fx-padding: 0.416em; /* 5px */
+}
+
+.dialog-pane > .button-bar > .container > .details-button.more {
+    -fx-graphic: url("dialog-more-details.png");
+}
+
+.dialog-pane > .button-bar > .container > .details-button.less {
+    -fx-graphic: url("dialog-fewer-details.png");
+}
+
+.dialog-pane > .button-bar > .container > .details-button:hover {
+    -fx-underline: true;
+}
+
+.alert.confirmation.dialog-pane,
+.text-input-dialog.dialog-pane,
+.choice-dialog.dialog-pane {
+    -fx-graphic: url("dialog-confirm.png");
+}
+
+.alert.information.dialog-pane {
+    -fx-graphic: url("dialog-information.png");
+}
+
+.alert.error.dialog-pane {
+    -fx-graphic: url("dialog-error.png");
+}
+
+.alert.warning.dialog-pane {
+    -fx-graphic: url("dialog-warning.png");
+}
\ No newline at end of file
diff --git a/utilities/src/main/resources/darktheme.css b/utilities/src/main/resources/darktheme.css
new file mode 100644
index 0000000000000000000000000000000000000000..87c2f97405482f84cc68a6ef407d367164d11339
--- /dev/null
+++ b/utilities/src/main/resources/darktheme.css
@@ -0,0 +1,297 @@
+.html-editor{
+    -fx-background-color: #121212;
+}
+
+.html-editor .top-toolbar {
+    -fx-background-color: #292929;
+}
+
+.html-editor .bottom-toolbar {
+    -fx-background-color: #292929;
+}
+
+#textarea .html-editor .web-view {
+    -fx-background-color: black;
+}
+
+
+.html-editor-foreground, .html-editor-background {
+    -fx-color-label-visible: true;
+    -fx-color-rect-x: 0;
+    -fx-color-rect-y: 10;
+    -fx-color-rect-width: 16;
+    -fx-color-rect-height: 5;
+    -fx-padding: 0;
+}
+
+.dialog-pane {
+    -fx-background-color: black;
+    -fx-padding: 0;
+}
+
+/*.html-editor .button, .html-editor .toggle-button, .html-editor .color-picker {
+    -fx-background-color: #292929;
+    -fx-border-color: #E0E0E0;
+
+}*/
+
+/*Combo Boxes*/
+.html-editor .combo-box {
+    /*-fx-background-color: #292929;
+    -fx-border-color: #E0E0E0;
+    -fx-text-fill: #E0E0E0;
+    -fx-background-radius: 0;*/
+    -fx-border-insets: 0 0 -1 0;
+    -fx-border-width: 1;
+    -fx-border-color: #E0E0E0;
+    -fx-background-color: #292929;
+}
+
+.combo-box .list-cell:selected{
+    -fx-background-color: #292929;
+}
+
+.combo-box .list-cell:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+/*.combo-box:hover{
+    -fx-border-color: #222222;
+    -fx-background-color: #3E3E40;
+}*/
+
+/*.combo-box:focused{
+    -fx-border-color: #4e4e4e;
+    -fx-background-color: #1A1A1A;
+}*/
+
+/*.combo-box-base .arrow-button {
+    -fx-padding: 0 6;
+}*/
+
+.combo-box-base .arrow-button .arrow {
+    -fx-background-color: #E0E0E0;
+}
+
+/*.combo-box .list-view{
+    -fx-background-radius: 0;
+    -fx-background-color: #1A1A1A;
+    background-color: #1A1A1A;
+    -fx-border-width: 0;
+    border-width: 0;
+    -fx-padding: 1;
+    padding: 1;
+}*/
+
+/*List Cells*/
+.list-cell{
+    -fx-text-fill: #E0E0E0;
+    -fx-background-color: #292929;
+}
+
+/*.list-cell:hover{
+    -fx-background-color: #3E3E40;
+}*/
+
+/*.list-cell:pressed{
+    -fx-background-color: #3E3E40;
+}*/
+
+/*.list-cell:selected{
+    -fx-background-color: #E0E0E0;
+}*/
+
+/*ListView*/
+.list-view{
+    -fx-background-color: #292929;
+}
+
+/*.list-view .scroll-bar{
+    -fx-background-insets: 0 -1 0 0;
+}*/
+
+/*Buttons*/
+.button {
+    -fx-text-fill: #E0E0E0;
+    -fx-background-color: #292929;
+    -fx-border-color: #E0E0E0;
+}
+
+.button:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+.button:pressed{
+    -fx-border-color: #474747;
+    -fx-background-color: #474747;
+}
+
+/*ScrollBar*/
+.scroll-bar{
+    -fx-background-color: #292929;
+}
+
+.scroll-bar .decrement-button, .scroll-bar .increment-button{
+    -fx-background-color: #292929;
+}
+
+.scroll-bar .decrement-button:hover, .scroll-bar .increment-button:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+.scroll-bar .increment-arrow, .scroll-bar .decrement-arrow {
+    -fx-background-color: #121212;
+}
+
+.scroll-bar .thumb {
+    -fx-background-color: #121212;
+}
+
+/*Tooltip*/
+.tooltip{
+    -fx-text-fill: #121212;
+    -fx-background-color: #E0E0E0;
+}
+
+/*ToggleButtons*/
+.toggle-button {
+    -fx-text-fill: #E0E0E0;
+    -fx-background-color: #292929;
+    -fx-border-color: #E0E0E0;
+}
+
+.toggle-button:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+.toggle-button:pressed{
+    -fx-border-color: #474747;
+    -fx-background-color: #474747;
+}
+
+/*ColorPicker*/
+
+.color-picker {
+    -fx-background-color: #292929;
+    -fx-border-color: #E0E0E0;
+}
+
+.color-picker .arrow-button .arrow {
+    -fx-background-color: #E0E0E0;
+}
+
+/*ColorPalette*/
+.color-palette{
+    -fx-background-color: #292929;
+    -fx-text-fill: #E0E0E0;
+    -fx-spacing: 15px;
+        -fx-background-insets: 0, 1, 2;
+        -fx-background-radius: 0 6 6 6, 0 5 5 5, 0 4 4 4;
+        -fx-padding: 15 15 15 15;
+        -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 8, 0.0 , 0 , 0 );
+}
+
+.color-palette > .color-picker-grid > .color-square > .color-rect {
+    -fx-stroke: black;
+    -fx-stroke-width: 0.4;
+    -fx-border-color: black;
+}
+
+.color-palette > .color-picker-grid {
+    -fx-border-color: transparent;
+}
+
+.color-palette .color-picker-grid .color-square {
+    -fx-background-color: transparent;
+    -fx-background-insets: -1, 0;
+    -fx-padding: 0.5;
+    -fx-border: black;
+}
+
+.color-palette-region .color-square.hover-square {
+    -fx-background-color: #EEAE4D;
+    -fx-border-color: #EEAE4D;
+    -fx-background-insets: -1;
+    -fx-padding: 0;
+}
+
+.color-palette .separator .line {
+    -fx-background-color: #121212;
+    -fx-border-color: #121212;
+}
+
+/*ColorDialogueBox*/
+.custom-color-dialog {
+    -fx-background-color: #292929;
+    -fx-text-fill: #E0E0E0;
+}
+
+.custom-color-dialog .controls-pane .customcolor-controls-background {
+    -fx-background-color: #292929;
+}
+
+.custom-color-dialog .controls-pane .current-new-color-grid .label {
+    -fx-text-fill: #E0E0E0;
+}
+
+/*.custom-color-dialog .controls-pane #settings-pane {
+    -fx-hgap: 1.4166667em;
+    -fx-vgap: 0.3333333em;
+}*/
+
+/*MenuBar*/
+.menu {
+    -fx-text-fill: #E0E0E0;
+}
+
+.menu-bar {
+    -fx-background-color: #121212;
+    background-color: #121212;
+    -fx-text-fill: #E0E0E0;
+    text-fill: #E0E0E0;
+}
+
+.menu-bar .menu-button {
+    -fx-background-color: #121212;
+    background-color: #121212;
+    -fx-text-fill: #E0E0E0;
+    text-fill: #E0E0E0;
+}
+
+.menu-bar .menu-button:hover {
+    -fx-background-color: #EEAE4D;
+    background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+    text-fill:#121212;
+}
+
+.menu-item {
+    -fx-background-color: #121212;
+    background-color: #121212;
+    -fx-text-fill: #E0E0E0;
+    text-fill: #E0E0E0;
+    -fx-border-width: 0;
+}
+
+.menu-item:hover {
+    -fx-background-color: #EEAE4D;
+    background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+    text-fill: #121212;
+}
+
+.label {
+    -fx-text-fill: #E0E0E0;
+}
+
+.label:hover {
+    -fx-text-fill: #121212;
+}
+
+.text-input-control {
+    -fx-text-fill: #E0E0E0;
+}
diff --git a/utilities/src/main/resources/darkthemeBrowser.css b/utilities/src/main/resources/darkthemeBrowser.css
new file mode 100644
index 0000000000000000000000000000000000000000..297d23e3edbeaee0676c2ff5add5140bb3f47ba5
--- /dev/null
+++ b/utilities/src/main/resources/darkthemeBrowser.css
@@ -0,0 +1,55 @@
+
+
+.table-view .column-header {
+    -fx-background-color: #424140;
+    -fx-text-background-color: white;
+}
+
+.table-view .table-cell{
+    -fx-border-color: transparent;
+    -fx-padding: 2 0 2 10px;
+}
+.table-row-cell: hover {
+    -fx-background-color: #f56e3d;
+    -fx-text-background-color: orange;
+}
+.table-row-cell: odd{
+    -fx-background-color: #1e1e1f;
+    -fx-background-insets: 0, 0 0 1 0;
+    -fx-padding: 0.0em;
+    -fx-text-background-color: white;
+}
+.table-row-cell: even{
+    -fx-background-color: #48494a;
+    -fx-background-insets: 0, 0 0 1 0;
+    -fx-padding: 0.0em;
+    -fx-text-background-color: white;
+}
+.table-row-cell:selected {
+    -fx-background-color: #f7561b;
+    -fx-background-insets: 0;
+    -fx-background-radius: 1;
+}
+.root{
+    -fx-background-color: #262626;
+}
+.table-view .virtual-flow .scroll-bar:vertical,
+.table-view .virtual-flow .scroll-bar:vertical .track,
+.table-view .virtual-flow .scroll-bar:vertical .track-background,
+.table-view .virtual-flow .scroll-bar:horizontal,
+.table-view .virtual-flow .scroll-bar:horizontal .track,
+.table-view .virtual-flow .scroll-bar:horizontal .track-background {
+    -fx-background-color: black;
+}
+
+.table-view .corner {
+    -fx-background-color: black;
+}
+.table-view .footer {
+    -fx-background-color: black;
+    -fx-text-fill: white;
+    -fx-font-weight: bold;
+    -fx-alignment: center-right;
+    -fx-padding: 5px;
+}
+
diff --git a/utilities/src/main/resources/lighttheme.css b/utilities/src/main/resources/lighttheme.css
new file mode 100644
index 0000000000000000000000000000000000000000..54716b98a363b4e6dd9d4051e0922a556a3a6a77
--- /dev/null
+++ b/utilities/src/main/resources/lighttheme.css
@@ -0,0 +1,291 @@
+.html-editor{
+    -fx-background-color: #121212;
+}
+
+.html-editor .top-toolbar {
+    -fx-background-color: #E0E0E0;
+}
+
+.html-editor .bottom-toolbar {
+    -fx-background-color: #E0E0E0;
+}
+
+#textarea .html-editor .web-view {
+    -fx-background-color: #f0f0f0;
+}
+
+.html-editor-foreground, .html-editor-background {
+    -fx-color-label-visible: true;
+    -fx-color-rect-x: 0;
+    -fx-color-rect-y: 10;
+    -fx-color-rect-width: 16;
+    -fx-color-rect-height: 5;
+    -fx-padding: 0;
+}
+
+/*.html-editor .button, .html-editor .toggle-button, .html-editor .color-picker {
+    -fx-background-color: #E0E0E0;
+    -fx-border-color: #E0E0E0;
+
+}*/
+
+/*Combo Boxes*/
+.html-editor .combo-box {
+    /*-fx-background-color: #E0E0E0;
+    -fx-border-color: #E0E0E0;
+    -fx-text-fill: #E0E0E0;
+    -fx-background-radius: 0;*/
+    -fx-border-insets: 0 0 -1 0;
+    -fx-border-width: 1;
+    -fx-border-color: #E0E0E0;
+    -fx-background-color: #E0E0E0;
+}
+
+.combo-box .list-cell:selected{
+    -fx-background-color: #E0E0E0;
+}
+
+.combo-box .list-cell:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+/*.combo-box:hover{
+    -fx-border-color: #222222;
+    -fx-background-color: #3E3E40;
+}*/
+
+/*.combo-box:focused{
+    -fx-border-color: #4e4e4e;
+    -fx-background-color: #1A1A1A;
+}*/
+
+/*.combo-box-base .arrow-button {
+    -fx-padding: 0 6;
+}*/
+
+.combo-box-base .arrow-button .arrow {
+    -fx-background-color: #E0E0E0;
+}
+
+/*.combo-box .list-view{
+    -fx-background-radius: 0;
+    -fx-background-color: #1A1A1A;
+    background-color: #1A1A1A;
+    -fx-border-width: 0;
+    border-width: 0;
+    -fx-padding: 1;
+    padding: 1;
+}*/
+
+/*List Cells*/
+.list-cell{
+    -fx-text-fill: #E0E0E0;
+    -fx-background-color: #E0E0E0;
+}
+
+/*.list-cell:hover{
+    -fx-background-color: #3E3E40;
+}*/
+
+/*.list-cell:pressed{
+    -fx-background-color: #3E3E40;
+}*/
+
+/*.list-cell:selected{
+    -fx-background-color: #E0E0E0;
+}*/
+
+/*ListView*/
+.list-view{
+    -fx-background-color: #E0E0E0;
+}
+
+/*.list-view .scroll-bar{
+    -fx-background-insets: 0 -1 0 0;
+}*/
+
+/*Buttons*/
+.button {
+    -fx-text-fill: #E0E0E0;
+    -fx-background-color: #E0E0E0;
+    -fx-border-color: #E0E0E0;
+}
+
+.button:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+.button:pressed{
+    -fx-border-color: #474747;
+    -fx-background-color: #474747;
+}
+
+/*ScrollBar*/
+.scroll-bar{
+    -fx-background-color: #E0E0E0;
+}
+
+.scroll-bar .decrement-button, .scroll-bar .increment-button{
+    -fx-background-color: #E0E0E0;
+}
+
+.scroll-bar .decrement-button:hover, .scroll-bar .increment-button:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+.scroll-bar .increment-arrow, .scroll-bar .decrement-arrow {
+    -fx-background-color: #121212;
+}
+
+.scroll-bar .thumb {
+    -fx-background-color: #121212;
+}
+
+/*Tooltip*/
+.tooltip{
+    -fx-text-fill: #121212;
+    -fx-background-color: #E0E0E0;
+}
+
+/*ToggleButtons*/
+.toggle-button {
+    -fx-text-fill: #E0E0E0;
+    -fx-background-color: #E0E0E0;
+    -fx-border-color: #E0E0E0;
+}
+
+.toggle-button:hover{
+    -fx-background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+}
+
+.toggle-button:pressed{
+    -fx-border-color: #474747;
+    -fx-background-color: #474747;
+}
+
+/*ColorPicker*/
+
+.color-picker {
+    -fx-background-color: #E0E0E0;
+    -fx-border-color: #E0E0E0;
+}
+
+.color-picker .arrow-button .arrow {
+    -fx-background-color: #E0E0E0;
+}
+
+/*ColorPalette*/
+.color-palette{
+    -fx-background-color: #E0E0E0;
+    -fx-text-fill: #E0E0E0;
+    -fx-spacing: 15px;
+        -fx-background-insets: 0, 1, 2;
+        -fx-background-radius: 0 6 6 6, 0 5 5 5, 0 4 4 4;
+        -fx-padding: 15 15 15 15;
+        -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 8, 0.0 , 0 , 0 );
+}
+
+.color-palette > .color-picker-grid > .color-square > .color-rect {
+    -fx-stroke: black;
+    -fx-stroke-width: 0.4;
+    -fx-border-color: black;
+}
+
+.color-palette > .color-picker-grid {
+    -fx-border-color: transparent;
+}
+
+.color-palette .color-picker-grid .color-square {
+    -fx-background-color: transparent;
+    -fx-background-insets: -1, 0;
+    -fx-padding: 0.5;
+    -fx-border: black;
+}
+
+.color-palette-region .color-square.hover-square {
+    -fx-background-color: #EEAE4D;
+    -fx-border-color: #EEAE4D;
+    -fx-background-insets: -1;
+    -fx-padding: 0;
+}
+
+.color-palette .separator .line {
+    -fx-background-color: #121212;
+    -fx-border-color: #121212;
+}
+
+/*ColorDialogueBox*/
+.custom-color-dialog {
+    -fx-background-color: #E0E0E0;
+    -fx-text-fill: #121212;
+}
+
+.custom-color-dialog .controls-pane .customcolor-controls-background {
+    -fx-background-color: #E0E0E0;
+}
+
+.custom-color-dialog .controls-pane .current-new-color-grid .label {
+    -fx-text-fill: #E0E0E0;
+}
+
+/*.custom-color-dialog .controls-pane #settings-pane {
+    -fx-hgap: 1.4166667em;
+    -fx-vgap: 0.3333333em;
+}*/
+
+/*MenuBar*/
+.menu {
+    -fx-text-fill: #E0E0E0;
+}
+
+.menu-bar {
+    -fx-background-color: #121212;
+    background-color: #121212;
+    -fx-text-fill: #E0E0E0;
+    text-fill: #E0E0E0;
+}
+
+.menu-bar .menu-button {
+    -fx-background-color: #121212;
+    background-color: #121212;
+    -fx-text-fill: #E0E0E0;
+    text-fill: #E0E0E0;
+}
+
+.menu-bar .menu-button:hover {
+    -fx-background-color: #EEAE4D;
+    background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+    text-fill:#121212;
+}
+
+.menu-item {
+    -fx-background-color: #121212;
+    background-color: #121212;
+    -fx-text-fill: #E0E0E0;
+    text-fill: #E0E0E0;
+    -fx-border-width: 0;
+}
+
+.menu-item:hover {
+    -fx-background-color: #EEAE4D;
+    background-color: #EEAE4D;
+    -fx-text-fill: #121212;
+    text-fill: #121212;
+}
+
+.label {
+    -fx-text-fill: #E0E0E0;
+}
+
+.label:hover {
+    -fx-text-fill: #121212;
+}
+
+.text-input-control {
+    -fx-text-fill: #E0E0E0;
+}
diff --git a/utilities/src/main/resources/newFile.css b/utilities/src/main/resources/newFile.css
new file mode 100644
index 0000000000000000000000000000000000000000..262a6780044e204ce535221787d467de18de45c9
--- /dev/null
+++ b/utilities/src/main/resources/newFile.css
@@ -0,0 +1,3 @@
+.text-area .content{
+      -fx-background-color: black;
+  }
\ No newline at end of file