diff --git a/client/src/main.c b/client/src/main.c
index a710c4d..ef917e5 100644
--- a/client/src/main.c
+++ b/client/src/main.c
@@ -96,13 +96,12 @@ uint32_t add_hex_region(ClientContext* context) {
 typedef struct ColorUIDataStruct {
   double current_hsv[3];
   vec4 current;
-  vec3 saved[12];
+  vec4 saved[12];
   char string[10];
   int string_len;
 } ColorUIData;
 
-void set_rgb_from_hsv(UIContext* ui, RenderContext* gpu, ColorUIData* data, double hsv[3]) {
-  hsv_to_rgb(hsv, data->current);
+void update_hex_string(UIContext* ui, RenderContext* gpu, ColorUIData* data) {
   snprintf(data->string, 10, "#%02X%02X%02X%02X",
       (uint)rintf(data->current[0]*255),
       (uint)rintf(data->current[1]*255),
@@ -166,7 +165,8 @@ void sv_square_pick(UIContext* ui, RenderContext* gpu, ColorUIData* data, float
       4*sizeof(vec4),
       gpu);
 
-  set_rgb_from_hsv(ui, gpu, data, data->current_hsv);
+  hsv_to_rgb(data->current_hsv, data->current);
+  update_hex_string(ui, gpu, data);
 }
 
 void sv_square_button_callback(void* data, UIContext* ui, RenderContext* gpu, float x, float y, int button, int action, int mods) {
@@ -234,7 +234,8 @@ void hue_bar_set(UIContext* ui, RenderContext* gpu, ColorUIData* data, float y)
       1*sizeof(float),
       gpu);
 
-  set_rgb_from_hsv(ui, gpu, data, data->current_hsv);
+  hsv_to_rgb(data->current_hsv, data->current);
+  update_hex_string(ui, gpu, data);
 }
 
 void hue_bar_scroll_callback(void* data, UIContext* ui, RenderContext* gpu, double x, double y) {
@@ -312,7 +313,8 @@ bool hex_string_key_callback(void* ptr, UIContext* ui, RenderContext* gpu, int k
   if(action == GLFW_PRESS) {
     switch(key) {
     case GLFW_KEY_ESCAPE:
-      set_rgb_from_hsv(ui, gpu, data, data->current_hsv);
+      hsv_to_rgb(data->current_hsv, data->current);
+      update_hex_string(ui, gpu, data);
       clear_active_element(ui, gpu);
       break;
     case GLFW_KEY_ENTER:
@@ -369,9 +371,102 @@ void hex_string_button_callback(void* data, UIContext* ui, RenderContext* gpu, f
 }
 
 void hex_string_deselect_callback(void* data, UIContext* ui, RenderContext* gpu) {
+  (void)data;
   hex_string_set_color(ui, gpu, 0);
 }
 
+void set_saved_color(UIContext* ui, RenderContext* gpu, ColorUIData* data, uint32_t index, vec4 color) {
+  data->saved[index][0] = color[0];
+  data->saved[index][1] = color[1];
+  data->saved[index][2] = color[2];
+  data->saved[index][3] = color[3];
+
+  Container* container = context_container(COLOR_PICK_CONTAINER_ID, ui);
+  Layer* layer = &container->layers[0];
+  GPUDrawable* saved_color = &layer->drawables_buffer[7 + index];
+
+  saved_color->color[0][0] = data->current[0];
+  saved_color->color[0][1] = data->current[1];
+  saved_color->color[0][2] = data->current[2];
+
+  saved_color->color[1][0] = data->current[0];
+  saved_color->color[1][1] = data->current[1];
+  saved_color->color[1][2] = data->current[2];
+
+  saved_color->color[2][0] = data->current[0];
+  saved_color->color[2][1] = data->current[1];
+  saved_color->color[2][2] = data->current[2];
+
+  saved_color->color[3][0] = data->current[0];
+  saved_color->color[3][1] = data->current[1];
+  saved_color->color[3][2] = data->current[2];
+
+  add_transfers(
+      &saved_color->color[0],
+      layer->drawables,
+      (7+index)*sizeof(GPUDrawable) + offsetof(GPUDrawable, color),
+      4*sizeof(vec4),
+      gpu);
+}
+
+void saved_color_button_callback(
+    void* ptr,
+    UIContext* ui,
+    RenderContext* gpu,
+    float x, float y,
+    int button, int action, int mods,
+    uint32_t index) {
+  (void)x;
+  (void)y;
+  (void)mods;
+
+  ColorUIData* data = ptr;
+
+  if(action == GLFW_PRESS) {
+    if(button == GLFW_MOUSE_BUTTON_LEFT) {
+      data->current[0] = data->saved[index][0];
+      data->current[1] = data->saved[index][1];
+      data->current[2] = data->saved[index][2];
+      data->current[3] = data->saved[index][3];
+      rgb_to_hsv(data->current, data->current_hsv);
+      hue_bar_set(ui, gpu, data, data->current_hsv[0]);
+      sv_square_pick(ui, gpu, data, data->current_hsv[1], data->current_hsv[2]);
+      update_hex_string(ui, gpu, data);
+    } else if(button == GLFW_MOUSE_BUTTON_RIGHT) {
+      set_saved_color(ui, gpu, data, index, data->current);
+    } else if (button == GLFW_MOUSE_BUTTON_MIDDLE) {
+      vec4 clear = {0, 0, 0, 0};
+      set_saved_color(ui, gpu, data, index, clear);
+    }
+  }
+}
+
+#define SAVED_COLOR_BUTTON_CALLBACK(n) \
+void saved_color_button_callback_##n(void* data, UIContext* ui, RenderContext* gpu, float x, float y, int button, int action, int mods) { \
+  saved_color_button_callback(data, ui, gpu, x, y, button, action, mods, n); \
+}
+
+SAVED_COLOR_BUTTON_CALLBACK( 0);
+SAVED_COLOR_BUTTON_CALLBACK( 1);
+SAVED_COLOR_BUTTON_CALLBACK( 2);
+SAVED_COLOR_BUTTON_CALLBACK( 3);
+SAVED_COLOR_BUTTON_CALLBACK( 4);
+SAVED_COLOR_BUTTON_CALLBACK( 5);
+SAVED_COLOR_BUTTON_CALLBACK( 6);
+SAVED_COLOR_BUTTON_CALLBACK( 7);
+SAVED_COLOR_BUTTON_CALLBACK( 8);
+SAVED_COLOR_BUTTON_CALLBACK( 9);
+SAVED_COLOR_BUTTON_CALLBACK(10);
+SAVED_COLOR_BUTTON_CALLBACK(11);
+
+#define SAVED_COLOR_CALLBACK_ENTRY(n) \
+    { \
+      .layer = 0, \
+      .element = 7 + n, \
+      .data = data, \
+      .button = saved_color_button_callback_##n, \
+    }
+
 VkResult color_ui(ClientContext* context) {
   GPUString strings[] = {
     {
@@ -429,61 +524,73 @@ VkResult color_ui(ClientContext* context) {
       .pos = {146, 2},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {168, 2},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {146, 24},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {168, 24},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {146, 46},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {168, 46},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {146, 68},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {168, 68},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {146, 90},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {168, 90},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {146, 112},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
     {
       .pos = {168, 112},
       .size = {20, 20},
       .color = {{1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}, {1, 1, 1, 1}},
+      .events = UI_EVENT_BUTTON,
     },
   };
 
@@ -542,6 +649,18 @@ VkResult color_ui(ClientContext* context) {
       .text = hex_string_text_callback,
       .deselect = hex_string_deselect_callback,
     },
+    SAVED_COLOR_CALLBACK_ENTRY( 0),
+    SAVED_COLOR_CALLBACK_ENTRY( 1),
+    SAVED_COLOR_CALLBACK_ENTRY( 2),
+    SAVED_COLOR_CALLBACK_ENTRY( 3),
+    SAVED_COLOR_CALLBACK_ENTRY( 4),
+    SAVED_COLOR_CALLBACK_ENTRY( 5),
+    SAVED_COLOR_CALLBACK_ENTRY( 6),
+    SAVED_COLOR_CALLBACK_ENTRY( 7),
+    SAVED_COLOR_CALLBACK_ENTRY( 8),
+    SAVED_COLOR_CALLBACK_ENTRY( 9),
+    SAVED_COLOR_CALLBACK_ENTRY(10),
+    SAVED_COLOR_CALLBACK_ENTRY(11),
   };
 
   ContainerInput container = {