diff --git a/ShhShell/Host/HostsManager.swift b/ShhShell/Host/HostsManager.swift
index 439cff4..47e6c0c 100644
--- a/ShhShell/Host/HostsManager.swift
+++ b/ShhShell/Host/HostsManager.swift
@@ -61,6 +61,7 @@ class HostsManager: ObservableObject, @unchecked Sendable {
 		
 		guard let decodedThemes = try? JSONDecoder().decode([ThemeCodable].self, from: dataTheme) else { return }
 		
+		self.themes = []
 		for index in 0..<decodedThemes.count {
 			guard let encoded = try? JSONEncoder().encode(decodedThemes[index]) else { return }
 			guard let synthedTheme = Theme.decodeTheme(data: encoded) else { return }
@@ -117,6 +118,7 @@ class HostsManager: ObservableObject, @unchecked Sendable {
 	func updateTheme(_ theme: Theme) {
 		guard let index = themes.firstIndex(where: { $0.id == theme.id }) else { return }
 		themes[index] = theme
+		saveThemes()
 	}
 	
 	func renameTheme(_ theme: Theme?, to newName: String) {
diff --git a/ShhShell/Themes/ColorCodable.swift b/ShhShell/Themes/ColorCodable.swift
index 85b5069..4c5669e 100644
--- a/ShhShell/Themes/ColorCodable.swift
+++ b/ShhShell/Themes/ColorCodable.swift
@@ -38,17 +38,27 @@ struct ColorCodable: Codable, Hashable, Equatable {
 	}
 }
 
+extension ColorCodable {
+	var suiColor: SwiftUI.Color {
+		get {
+			let red = CGFloat(self.red)
+			let green = CGFloat(self.green)
+			let blue = CGFloat(self.blue)
+			return Color(UIColor(red: red, green: green, blue: blue, alpha: 1))
+		}
+		set {
+			let cc = ColorCodable(color: newValue)
+			self.red = cc.red
+			self.green = cc.green
+			self.blue = cc.blue
+		}
+	}
+}
+
 extension ColorCodable {
 	var stColor: SwiftTerm.Color {
 		return SwiftTerm.Color(self)
 	}
-	
-	var suiColor: SwiftUI.Color {
-		let red = CGFloat(self.red)/65535
-		let green = CGFloat(self.green)/65535
-		let blue = CGFloat(self.blue)/65535
-		return Color(UIColor(red: red, green: green, blue: blue, alpha: 1))
-	}
 }
 
 extension SwiftTerm.Color {
diff --git a/ShhShell/Themes/ThemeCodable.swift b/ShhShell/Themes/ThemeCodable.swift
index a1a248a..e286499 100644
--- a/ShhShell/Themes/ThemeCodable.swift
+++ b/ShhShell/Themes/ThemeCodable.swift
@@ -113,23 +113,72 @@ extension ThemeCodable {
 			}
 		}
 		set {
+			let cc = ColorCodable(color: newValue)
 			switch index {
-			case 0: ansi0 = ColorCodable(color: newValue)
-			case 1: ansi1 = ColorCodable(color: newValue)
-			case 2: ansi2 = ColorCodable(color: newValue)
-			case 3: ansi3 = ColorCodable(color: newValue)
-			case 4: ansi4 = ColorCodable(color: newValue)
-			case 5: ansi5 = ColorCodable(color: newValue)
-			case 6: ansi6 = ColorCodable(color: newValue)
-			case 7: ansi7 = ColorCodable(color: newValue)
-			case 8: ansi8 = ColorCodable(color: newValue)
-			case 9: ansi9 = ColorCodable(color: newValue)
-			case 10: ansi10 = ColorCodable(color: newValue)
-			case 11: ansi11 = ColorCodable(color: newValue)
-			case 12: ansi12 = ColorCodable(color: newValue)
-			case 13: ansi13 = ColorCodable(color: newValue)
-			case 14: ansi14 = ColorCodable(color: newValue)
-			case 15: ansi15 = ColorCodable(color: newValue)
+			case 0:
+				ansi0.red = cc.red
+				ansi0.green = cc.green
+				ansi0.blue = cc.blue
+			case 1:
+				ansi1.red = cc.red
+				ansi1.green = cc.green
+				ansi1.blue = cc.blue
+			case 2:
+				ansi2.red = cc.red
+				ansi2.green = cc.green
+				ansi2.blue = cc.blue
+			case 3:
+				ansi3.red = cc.red
+				ansi3.green = cc.green
+				ansi3.blue = cc.blue
+			case 4:
+				ansi4.red = cc.red
+				ansi4.green = cc.green
+				ansi4.blue = cc.blue
+			case 5:
+				ansi5.red = cc.red
+				ansi5.green = cc.green
+				ansi5.blue = cc.blue
+			case 6:
+				ansi6.red = cc.red
+				ansi6.green = cc.green
+				ansi6.blue = cc.blue
+			case 7:
+				ansi7.red = cc.red
+				ansi7.green = cc.green
+				ansi7.blue = cc.blue
+			case 8:
+				ansi8.red = cc.red
+				ansi8.green = cc.green
+				ansi8.blue = cc.blue
+			case 9:
+				ansi9.red = cc.red
+				ansi9.green = cc.green
+				ansi9.blue = cc.blue
+			case 10:
+				ansi10.red = cc.red
+				ansi10.green = cc.green
+				ansi10.blue = cc.blue
+			case 11:
+				ansi11.red = cc.red
+				ansi11.green = cc.green
+				ansi11.blue = cc.blue
+			case 12:
+				ansi12.red = cc.red
+				ansi12.green = cc.green
+				ansi12.blue = cc.blue
+			case 13:
+				ansi13.red = cc.red
+				ansi13.green = cc.green
+				ansi13.blue = cc.blue
+			case 14:
+				ansi14.red = cc.red
+				ansi14.green = cc.green
+				ansi14.blue = cc.blue
+			case 15:
+				ansi15.red = cc.red
+				ansi15.green = cc.green
+				ansi15.blue = cc.blue
 			default: fatalError()
 			}
 		}
diff --git a/ShhShell/Views/Themes/ThemeEditorView.swift b/ShhShell/Views/Themes/ThemeEditorView.swift
index b25361a..da3d17e 100644
--- a/ShhShell/Views/Themes/ThemeEditorView.swift
+++ b/ShhShell/Views/Themes/ThemeEditorView.swift
@@ -11,57 +11,67 @@ import SwiftTerm
 struct ThemeEditorView: View {
 	@ObservedObject var hostsManager: HostsManager
 	
-//	@State var theme: Theme
+	//	@State var theme: Theme
 	@State var themeCodable: ThemeCodable
 	
 	init(hostsManager: HostsManager, theme: Theme) {
 		self.hostsManager = hostsManager
-//		self.theme = theme
+		//		self.theme = theme
 		self.themeCodable = theme.themeCodable
 	}
 	
 	var body: some View {
 		NavigationStack {
-//			List {
-//			TextField("Name", text: $themeCodable.name)
-			
-			ThemePreview(hostsManager: HostsManager(), theme: themeCodable.toTheme(), canModify: false)
-				.id(themeCodable)
-			
-			Group {
-				Rectangle()
-					.fill(themeCodable.foreground.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.background.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.bold.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.cursor.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.cursorText.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.selection.stColor.suiColor)
-				Rectangle()
-					.fill(themeCodable.selectedText.stColor.suiColor)
-			}
-			.frame(width: 100)
-			.toolbar {
-				Button() {
-					
-				} label: {
-					Label("Donw", systemImage: "checkmark")
+			List {
+				TextField(
+					"Name",
+					text: Binding(get: { themeCodable.name ?? "Theme" }, set: { themeCodable.name = $0 })
+				)
+				.textFieldStyle(.roundedBorder)
+				
+				ThemePreview(hostsManager: HostsManager(), theme: themeCodable.toTheme(), canModify: false)
+					.id(themeCodable)
+				
+				Group {
+					HStack {
+						Rectangle()
+							.fill(themeCodable.foreground.suiColor)
+						Text("Foreground")
+						Spacer()
+						ColorPicker("", selection: $themeCodable.foreground.suiColor, supportsOpacity: false)
+							.labelsHidden()
+					}
+					Rectangle()
+						.fill(themeCodable.background.suiColor)
+					Rectangle()
+						.fill(themeCodable.bold.suiColor)
+					Rectangle()
+						.fill(themeCodable.cursor.suiColor)
+					Rectangle()
+						.fill(themeCodable.cursorText.suiColor)
+					Rectangle()
+						.fill(themeCodable.selection.suiColor)
+					Rectangle()
+						.fill(themeCodable.selectedText.suiColor)
 				}
-			}
-			
+				
 				ForEach(0...1, id: \.self) { row in
 					HStack {
 						ForEach(1...8, id: \.self) { col in
 							let index = (col + (row * 8)) - 1
-							ColorPicker("Ansi \(index+1)", selection: $themeCodable[ansiIndex: index])
+							ColorPicker("Ansi \(index+1)", selection: $themeCodable[ansiIndex: index], supportsOpacity: false)
 						}
 					}
 				}
-//			}
+			}
+			.navigationTitle("Edit Theme")
+			.toolbar {
+				Button() {
+					hostsManager.updateTheme(themeCodable.toTheme())
+				} label: {
+					Label("Done", systemImage: "checkmark")
+				}
+			}
 		}
 	}
 }