12 files changed, 434 insertions, 141 deletions

diff --git a/src/app.c b/src/app.c
index 5543db11..919a17fa 100644
--- a/src/app.c
+++ b/src/app.c
@@ -69,6 +69,7 @@ struct Impl_App {
     iRect        initialWindowRect;
     float        uiScale;
     int          zoomPercent;
+    enum iColorTheme theme;
 };
 
 static iApp app_;
@@ -112,6 +113,7 @@ static iString *serializePrefs_App_(const iApp *d) {
     appendFormat_String(str, "sidebar.mode arg:%d\n", mode_SidebarWidget(sidebar));
     appendFormat_String(str, "uiscale arg:%f\n", uiScale_Window(d->window));
     appendFormat_String(str, "zoom.set arg:%d\n", d->zoomPercent);
+    appendFormat_String(str, "theme.set arg:%d\n", d->theme);
     return str;
 }
 
@@ -231,6 +233,7 @@ static void init_App_(iApp *d, int argc, char **argv) {
     init_SortedArray(&d->tickers, sizeof(iTicker), cmp_Ticker_);
     d->commandEcho       = checkArgument_CommandLine(&d->args, "echo") != NULL;
     d->initialWindowRect = init_Rect(-1, -1, 800, 500);
+    d->theme             = dark_ColorTheme;
     d->running           = iFalse;
     d->window            = NULL;
     d->retainWindowSize  = iTrue;
@@ -240,6 +243,7 @@ static void init_App_(iApp *d, int argc, char **argv) {
     d->visited           = new_Visited();
     d->bookmarks         = new_Bookmarks();
     d->tabEnum           = 0; /* generates unique IDs for tab pages */
+    setThemePalette_Color(d->theme);
     loadPrefs_App_(d);
     load_Visited(d->visited, dataDir_App_);
     load_Bookmarks(d->bookmarks, dataDir_App_);
@@ -364,6 +368,10 @@ int zoom_App(void) {
     return app_.zoomPercent;
 }
 
+enum iColorTheme colorTheme_App(void) {
+    return app_.theme;
+}
+
 int run_App(int argc, char **argv) {
     init_App_(&app_, argc, argv);
     const int rc = run_App_(&app_);
@@ -430,6 +438,14 @@ iBookmarks *bookmarks_App(void) {
     return app_.bookmarks;
 }
 
+static void updatePrefsThemeButtons_(iWidget *d) {
+    for (size_t i = 0; i < max_ColorTheme; i++) {
+        setFlags_Widget(findChild_Widget(d, format_CStr("prefs.theme.%u", i)),
+                        selected_WidgetFlag,
+                        colorTheme_App() == i);
+    }
+}
+
 static iBool handlePrefsCommands_(iWidget *d, const char *cmd) {
     if (equal_Command(cmd, "prefs.dismiss") || equal_Command(cmd, "preferences")) {
         setUiScale_Window(get_Window(),
@@ -439,6 +455,9 @@ static iBool handlePrefsCommands_(iWidget *d, const char *cmd) {
         destroy_Widget(d);
         return iTrue;
     }
+    else if (equal_Command(cmd, "theme.changed")) {
+        updatePrefsThemeButtons_(d);
+    }
     return iFalse;
 }
 
@@ -581,6 +600,7 @@ iBool handleCommand_App(const char *cmd) {
     }
     else if (equal_Command(cmd, "preferences")) {
         iWidget *dlg = makePreferences_Widget();
+        updatePrefsThemeButtons_(dlg);
         setToggle_Widget(findChild_Widget(dlg, "prefs.retainwindow"), d->retainWindowSize);
         setText_InputWidget(findChild_Widget(dlg, "prefs.uiscale"),
                             collectNewFormat_String("%g", uiScale_Window(d->window)));
@@ -618,6 +638,12 @@ iBool handleCommand_App(const char *cmd) {
         postCommand_App("bookmarks.changed");
         return iTrue;
     }
+    else if (equal_Command(cmd, "theme.set")) {
+        d->theme = arg_Command(cmd);
+        setThemePalette_Color(d->theme);
+        postCommand_App("theme.changed");
+        return iTrue;
+    }
     else {
         return iFalse;
     }
diff --git a/src/app.h b/src/app.h
index 9a6306b9..11c8c4a3 100644
--- a/src/app.h
+++ b/src/app.h
@@ -5,6 +5,8 @@
 #include <the_Foundation/string.h>
 #include <the_Foundation/time.h>
 
+#include "ui/color.h"
+
 iDeclareType(Bookmarks)
 iDeclareType(DocumentWidget)
 iDeclareType(GmCerts)
@@ -29,7 +31,9 @@ void        processEvents_App   (enum iAppEventMode mode);
 iBool       handleCommand_App   (const char *cmd);
 void        refresh_App         (void);
 iBool       isRefreshPending_App(void);
-int         zoom_App            (void);
+
+int                 zoom_App            (void);
+enum iColorTheme    colorTheme_App      (void);
 
 iGmCerts *          certs_App           (void);
 iVisited *          visited_App         (void);
diff --git a/src/gmdocument.c b/src/gmdocument.c
index 52ff1654..c943dfe9 100644
--- a/src/gmdocument.c
+++ b/src/gmdocument.c
@@ -574,6 +574,7 @@ void reset_GmDocument(iGmDocument *d) {
 }
 
 void setThemeSeed_GmDocument(iGmDocument *d, const iBlock *seed) {
+    const iBool        isLightMode = (colorTheme_App() == light_ColorTheme);
     static const iChar siteIcons[] = {
         0x203b,  0x2042,  0x205c,  0x2182,  0x25ed,  0x2600,  0x2601,  0x2604,  0x2605,  0x2606,
         0x265c,  0x265e,  0x2690,  0x2691,  0x2693,  0x2698,  0x2699,  0x26f0,  0x270e,  0x2728,
@@ -585,19 +586,36 @@ void setThemeSeed_GmDocument(iGmDocument *d, const iBlock *seed) {
     d->themeSeed = 0;
     d->siteIcon  = 0;
     /* Default colors. */ {
-        const iHSLColor base = { 0, 0, 0.15f, 1.0f };
-        setHsl_Color(tmBackground_ColorId, base);
-        set_Color(tmParagraph_ColorId, get_Color(gray75_ColorId));
-        setHsl_Color(tmFirstParagraph_ColorId, addSatLum_HSLColor(base, 0, 0.75f));
-        set_Color(tmQuote_ColorId, get_Color(cyan_ColorId));
-        set_Color(tmPreformatted_ColorId, get_Color(cyan_ColorId));
-        set_Color(tmHeading1_ColorId, get_Color(white_ColorId));
-        setHsl_Color(tmHeading2_ColorId, addSatLum_HSLColor(base, 0, 0.7f));
-        setHsl_Color(tmHeading3_ColorId, addSatLum_HSLColor(base, 0, 0.6f));
-        set_Color(tmBannerBackground_ColorId, get_Color(black_ColorId));
-        set_Color(tmBannerTitle_ColorId, get_Color(white_ColorId));
-        set_Color(tmBannerIcon_ColorId, get_Color(orange_ColorId));
-        set_Color(tmInlineContentMetadata_ColorId, get_Color(cyan_ColorId));
+        if (!isLightMode) {
+            const iHSLColor base = { 0, 0, 0.15f, 1.0f };
+            setHsl_Color(tmBackground_ColorId, base);
+            set_Color(tmParagraph_ColorId, get_Color(gray75_ColorId));
+            setHsl_Color(tmFirstParagraph_ColorId, addSatLum_HSLColor(base, 0, 0.75f));
+            set_Color(tmQuote_ColorId, get_Color(cyan_ColorId));
+            set_Color(tmPreformatted_ColorId, get_Color(cyan_ColorId));
+            set_Color(tmHeading1_ColorId, get_Color(white_ColorId));
+            setHsl_Color(tmHeading2_ColorId, addSatLum_HSLColor(base, 0, 0.7f));
+            setHsl_Color(tmHeading3_ColorId, addSatLum_HSLColor(base, 0, 0.6f));
+            set_Color(tmBannerBackground_ColorId, get_Color(black_ColorId));
+            set_Color(tmBannerTitle_ColorId, get_Color(white_ColorId));
+            set_Color(tmBannerIcon_ColorId, get_Color(orange_ColorId));
+            set_Color(tmInlineContentMetadata_ColorId, get_Color(cyan_ColorId));
+        }
+        else {
+            const iHSLColor base = { 0, 0, 1.0f, 1.0f };
+            setHsl_Color(tmBackground_ColorId, base);
+            set_Color(tmParagraph_ColorId, get_Color(gray25_ColorId));
+            set_Color(tmFirstParagraph_ColorId, get_Color(black_ColorId));
+            set_Color(tmQuote_ColorId, get_Color(brown_ColorId));
+            set_Color(tmPreformatted_ColorId, get_Color(brown_ColorId));
+            set_Color(tmHeading1_ColorId, get_Color(black_ColorId));
+            setHsl_Color(tmHeading2_ColorId, addSatLum_HSLColor(base, 0, -0.7f));
+            setHsl_Color(tmHeading3_ColorId, addSatLum_HSLColor(base, 0, -0.6f));
+            set_Color(tmBannerBackground_ColorId, get_Color(white_ColorId));
+            set_Color(tmBannerTitle_ColorId, get_Color(gray50_ColorId));
+            set_Color(tmBannerIcon_ColorId, get_Color(teal_ColorId));
+            set_Color(tmInlineContentMetadata_ColorId, get_Color(brown_ColorId));
+        }
         set_Color(tmBadLink_ColorId, get_Color(red_ColorId));
         set_Color(tmLinkText_ColorId, get_Color(white_ColorId));
         set_Color(tmLinkIcon_ColorId, get_Color(cyan_ColorId));
@@ -639,17 +657,17 @@ void setThemeSeed_GmDocument(iGmDocument *d, const iBlock *seed) {
                 { 8, 9 },  /* violet */
                 { 7, 8 },  /* pink */
             };
-            const float saturationLevel = 1.0f; /* TODO: user setting */
-            const iBool isLightMode     = iFalse; /* TODO: user setting */
-            const iBool isBannerLighter = (d->themeSeed & 0x4000) != 0;
+            const float  saturationLevel = 1.0f; /* TODO: user setting */
+            const iBool  isBannerLighter = (d->themeSeed & 0x4000) != 0;
             const size_t primIndex       = (d->themeSeed & 0xff) % iElemCount(hues);
-            const iBool isDarkBgSat     = (d->themeSeed & 0x200000) != 0 && (primIndex < 1 || primIndex > 4);
-            iHSLColor    base            = { hues[primIndex],
+            const iBool  isDarkBgSat =
+                (d->themeSeed & 0x200000) != 0 && (primIndex < 1 || primIndex > 4);
+            iHSLColor base = { hues[primIndex],
                                0.8f * (d->themeSeed >> 24) / 255.0f,
                                0.06f + 0.09f * ((d->themeSeed >> 5) & 0x7) / 7.0f,
                                1.0f };
-//            printf("background: %d %f %f\n", (int) base.hue, base.sat, base.lum);
-//            printf("isDarkBgSat: %d\n", isDarkBgSat);
+            //            printf("background: %d %f %f\n", (int) base.hue, base.sat, base.lum);
+            //            printf("isDarkBgSat: %d\n", isDarkBgSat);
             setHsl_Color(tmBackground_ColorId, base);
 
             setHsl_Color(tmBannerBackground_ColorId, addSatLum_HSLColor(base, 0.1f, 0.04f * (isBannerLighter ? 1 : -1)));
diff --git a/src/ui/color.c b/src/ui/color.c
index a2ff6e27..b9470084 100644
--- a/src/ui/color.c
+++ b/src/ui/color.c
@@ -4,24 +4,134 @@
 
 static const iColor transparent_;
 
-static iColor palette_[max_ColorId] = {
+static const iColor darkPalette_[] = {
     { 0,   0,   0,   255 },
     { 40,  40,  40,  255 },
     { 80,  80,  80,  255 },
     { 160, 160, 160, 255 },
     { 255, 255, 255, 255 },
+
     { 106, 80,  0,   255 },
     { 255, 192, 0,   255 },
     { 0,   96,  128, 255 },
     { 0,   192, 255, 255 },
+
     { 255, 255, 32,  255 },
     { 255, 64,  64,  255 },
     { 255, 0,   255, 255 },
     { 132, 132, 255, 255 },
     { 0,   200, 0,   255 },
-    /* theme colors left black until theme is seeded */
 };
 
+static const iColor lightPalette_[] = {
+    { 0,   0,   0,   255 },
+    { 75,  75,  75,  255 },
+    { 150, 150, 150, 255 },
+    { 235, 235, 235, 255 },
+    { 255, 255, 255, 255 },
+
+    { 170, 128, 0,  255 },
+    { 255, 213, 86,  255 },
+    { 0,   96,  128, 255 },
+    { 86,  213, 255, 255 },
+
+    { 255, 255, 32,  255 },
+    { 255, 64,  64,  255 },
+    { 255, 0,   255, 255 },
+    { 132, 132, 255, 255 },
+    { 0,   150, 0,   255 },
+};
+
+static iColor palette_[max_ColorId];
+
+iLocalDef void copy_(enum iColorId dst, enum iColorId src) {
+    set_Color(dst, get_Color(src));
+}
+
+void setThemePalette_Color(enum iColorTheme theme) {
+    memcpy(palette_, theme == dark_ColorTheme ? darkPalette_ : lightPalette_, sizeof(darkPalette_));
+    switch (theme) {
+        default:
+        case dark_ColorTheme:
+            copy_(uiBackground_ColorId, gray25_ColorId);
+            copy_(uiBackgroundHover_ColorId, gray25_ColorId);
+            copy_(uiBackgroundPressed_ColorId, orange_ColorId);
+            copy_(uiBackgroundSelected_ColorId, teal_ColorId);
+            copy_(uiBackgroundFramelessHover_ColorId, teal_ColorId);
+            copy_(uiText_ColorId, gray75_ColorId);
+            copy_(uiTextPressed_ColorId, black_ColorId);
+            copy_(uiTextStrong_ColorId, white_ColorId);
+            copy_(uiTextSelected_ColorId, white_ColorId);
+            copy_(uiTextFramelessHover_ColorId, white_ColorId);
+            copy_(uiTextShortcut_ColorId, cyan_ColorId);
+            copy_(uiTextAction_ColorId, cyan_ColorId);
+            copy_(uiTextCaution_ColorId, orange_ColorId);
+            copy_(uiFrame_ColorId, gray25_ColorId);
+            copy_(uiEmboss1_ColorId, gray50_ColorId);
+            copy_(uiEmboss2_ColorId, black_ColorId);
+            copy_(uiEmbossHover1_ColorId, cyan_ColorId);
+            copy_(uiEmbossHover2_ColorId, teal_ColorId);
+            copy_(uiEmbossPressed1_ColorId, brown_ColorId);
+            copy_(uiEmbossPressed2_ColorId, white_ColorId);
+            copy_(uiEmbossSelected1_ColorId, cyan_ColorId);
+            copy_(uiEmbossSelected2_ColorId, black_ColorId);
+            copy_(uiEmbossSelectedHover1_ColorId, white_ColorId);
+            copy_(uiEmbossSelectedHover2_ColorId, cyan_ColorId);
+            copy_(uiInputBackground_ColorId, black_ColorId);
+            copy_(uiInputBackgroundFocused_ColorId, black_ColorId);
+            copy_(uiInputText_ColorId, gray75_ColorId);
+            copy_(uiInputTextFocused_ColorId, white_ColorId);
+            copy_(uiInputFrame_ColorId, gray50_ColorId);
+            copy_(uiInputFrameHover_ColorId, cyan_ColorId);
+            copy_(uiInputFrameFocused_ColorId, orange_ColorId);
+            copy_(uiInputCursor_ColorId, orange_ColorId);
+            copy_(uiInputCursorText_ColorId, black_ColorId);
+            copy_(uiHeading_ColorId, cyan_ColorId);
+            copy_(uiIcon_ColorId, cyan_ColorId);
+            copy_(uiSeparator_ColorId, black_ColorId);
+            break;
+        case light_ColorTheme:
+            copy_(uiBackground_ColorId, white_ColorId);
+            copy_(uiBackgroundHover_ColorId, gray75_ColorId);
+            copy_(uiBackgroundSelected_ColorId, orange_ColorId);
+            copy_(uiBackgroundPressed_ColorId, cyan_ColorId);
+            copy_(uiBackgroundFramelessHover_ColorId, orange_ColorId);
+            copy_(uiText_ColorId, gray25_ColorId);
+            copy_(uiTextStrong_ColorId, black_ColorId);
+            copy_(uiTextPressed_ColorId, black_ColorId);
+            copy_(uiTextStrong_ColorId, black_ColorId);
+            copy_(uiTextSelected_ColorId, black_ColorId);
+            copy_(uiTextFramelessHover_ColorId, black_ColorId);
+            copy_(uiTextShortcut_ColorId, brown_ColorId);
+            copy_(uiTextAction_ColorId, brown_ColorId);
+            copy_(uiTextCaution_ColorId, teal_ColorId);
+            copy_(uiFrame_ColorId, gray75_ColorId);
+            copy_(uiEmboss1_ColorId, white_ColorId);
+            copy_(uiEmboss2_ColorId, white_ColorId);
+            copy_(uiEmbossHover1_ColorId, gray25_ColorId);
+            copy_(uiEmbossHover2_ColorId, gray25_ColorId);
+            copy_(uiEmbossPressed1_ColorId, black_ColorId);
+            copy_(uiEmbossPressed2_ColorId, teal_ColorId);
+            copy_(uiEmbossSelected1_ColorId, white_ColorId);
+            copy_(uiEmbossSelected2_ColorId, brown_ColorId);
+            copy_(uiEmbossSelectedHover1_ColorId, gray50_ColorId);
+            copy_(uiEmbossSelectedHover2_ColorId, gray50_ColorId);
+            copy_(uiInputBackground_ColorId, white_ColorId);
+            copy_(uiInputBackgroundFocused_ColorId, white_ColorId);
+            copy_(uiInputText_ColorId, gray25_ColorId);
+            copy_(uiInputTextFocused_ColorId, black_ColorId);
+            copy_(uiInputFrame_ColorId, gray50_ColorId);
+            copy_(uiInputFrameHover_ColorId, brown_ColorId);
+            copy_(uiInputFrameFocused_ColorId, teal_ColorId);
+            copy_(uiInputCursor_ColorId, teal_ColorId);
+            copy_(uiInputCursorText_ColorId, white_ColorId);
+            copy_(uiHeading_ColorId, brown_ColorId);
+            copy_(uiIcon_ColorId, brown_ColorId);
+            copy_(uiSeparator_ColorId, gray50_ColorId);
+            break;
+    }
+}
+
 iColor get_Color(int color) {
     const iColor *rgba = &transparent_;
     if (color >= 0 && color < max_ColorId) {
@@ -31,11 +141,35 @@ iColor get_Color(int color) {
 }
 
 void set_Color(int color, iColor rgba) {
-    if (color >= tmFirst_ColorId && color < max_ColorId) {
+    if (color >= uiBackground_ColorId && color < max_ColorId) {
         palette_[color] = rgba;
     }
 }
 
+iLocalDef iBool equal_Color_(const iColor *x, const iColor *y) {
+    return memcmp(x, y, sizeof(iColor)) == 0;
+}
+
+int darker_Color(int color) {
+    const iColor rgb = get_Color(color);
+    for (int i = 0; i < uiFirst_ColorId; i++) {
+        if (equal_Color_(&rgb, &palette_[i])) {
+            return i > 0 ? i - 1 : i;
+        }
+    }
+    return color;
+}
+
+int lighter_Color(int color) {
+    const iColor rgb = get_Color(color);
+    for (int i = 0; i < uiFirst_ColorId; i++) {
+        if (equal_Color_(&rgb, &palette_[i])) {
+            return i < uiFirst_ColorId - 1 ? i + 1 : i;
+        }
+    }
+    return color;
+}
+
 iLocalDef iFloat4 normalize_(iColor d) {
     return divf_F4(init_F4(d.r, d.g, d.b, d.a), 255.0f);
 }
diff --git a/src/ui/color.h b/src/ui/color.h
index 6444ad03..77cbac09 100644
--- a/src/ui/color.h
+++ b/src/ui/color.h
@@ -3,8 +3,15 @@
 #include <the_Foundation/range.h>
 #include <the_Foundation/math.h>
 
+enum iColorTheme {
+    dark_ColorTheme,
+    light_ColorTheme,
+    max_ColorTheme
+};
+
 enum iColorId {
     none_ColorId = -1,
+
     black_ColorId,
     gray25_ColorId,
     gray50_ColorId,
@@ -20,6 +27,46 @@ enum iColorId {
     blue_ColorId,
     green_ColorId,
 
+    /* user interface colors for semantic use */
+    uiFirst_ColorId,
+    uiBackground_ColorId = uiFirst_ColorId,
+    uiBackgroundHover_ColorId,
+    uiBackgroundPressed_ColorId,
+    uiBackgroundSelected_ColorId,
+    uiBackgroundFramelessHover_ColorId,
+    uiText_ColorId,
+    uiTextPressed_ColorId,
+    uiTextSelected_ColorId,
+    uiTextFramelessHover_ColorId,
+    uiTextFramelessSelected_ColorId,
+    uiTextStrong_ColorId,
+    uiTextShortcut_ColorId,
+    uiTextAction_ColorId,
+    uiTextCaution_ColorId,
+    uiFrame_ColorId,
+    uiEmboss1_ColorId,
+    uiEmboss2_ColorId,
+    uiEmbossHover1_ColorId,
+    uiEmbossHover2_ColorId,
+    uiEmbossPressed1_ColorId,
+    uiEmbossPressed2_ColorId,
+    uiEmbossSelected1_ColorId,
+    uiEmbossSelected2_ColorId,
+    uiEmbossSelectedHover1_ColorId,
+    uiEmbossSelectedHover2_ColorId,
+    uiInputBackground_ColorId,
+    uiInputBackgroundFocused_ColorId,
+    uiInputText_ColorId,
+    uiInputTextFocused_ColorId,
+    uiInputFrame_ColorId,
+    uiInputFrameHover_ColorId,
+    uiInputFrameFocused_ColorId,
+    uiInputCursor_ColorId,
+    uiInputCursorText_ColorId,
+    uiHeading_ColorId,
+    uiIcon_ColorId,
+    uiSeparator_ColorId,
+
     /* content theme colors */
     tmFirst_ColorId,
     tmBackground_ColorId = tmFirst_ColorId,
@@ -77,23 +124,27 @@ iLocalDef iBool isRegularText_ColorId(enum iColorId d) {
     return isLinkText_ColorId(d) || d == tmParagraph_ColorId || d == tmFirstParagraph_ColorId;
 }
 
-#define mask_ColorId        0x3f
-#define permanent_ColorId   0x80 /* cannot be changed via escapes */
-
-#define black_ColorEscape   "\r0"
-#define gray25_ColorEscape  "\r1"
-#define gray50_ColorEscape  "\r2"
-#define gray75_ColorEscape  "\r3"
-#define white_ColorEscape   "\r4"
-#define brown_ColorEscape   "\r5"
-#define orange_ColorEscape  "\r6"
-#define teal_ColorEscape    "\r7"
-#define cyan_ColorEscape    "\r8"
-#define yellow_ColorEscape  "\r9"
-#define red_ColorEscape     "\r:"
-#define magenta_ColorEscape "\r;"
-#define blue_ColorEscape    "\r<"
-#define green_ColorEscape   "\r="
+#define mask_ColorId                0x7f
+#define permanent_ColorId           0x80 /* cannot be changed via escapes */
+
+#define black_ColorEscape           "\r0"
+#define gray25_ColorEscape          "\r1"
+#define gray50_ColorEscape          "\r2"
+#define gray75_ColorEscape          "\r3"
+#define white_ColorEscape           "\r4"
+#define brown_ColorEscape           "\r5"
+#define orange_ColorEscape          "\r6"
+#define teal_ColorEscape            "\r7"
+#define cyan_ColorEscape            "\r8"
+#define yellow_ColorEscape          "\r9"
+#define red_ColorEscape             "\r:"
+#define magenta_ColorEscape         "\r;"
+#define blue_ColorEscape            "\r<"
+#define green_ColorEscape           "\r="
+#define uiText_ColorEscape          "\rC"
+#define uiTextAction_ColorEscape    "\rJ"
+#define uiTextCaution_ColorEscape   "\rK"
+#define uiHeading_ColorEscape       "\r`"
 
 iDeclareType(Color)
 iDeclareType(HSLColor)
@@ -114,11 +165,15 @@ iHSLColor       setLum_HSLColor     (iHSLColor, float lum);
 iHSLColor       addSatLum_HSLColor  (iHSLColor, float sat, float lum);
 
 iColor          get_Color       (int color);
+int             darker_Color    (int color);
+int             lighter_Color   (int color);
 void            set_Color       (int color, iColor rgba);
 
 iLocalDef void setHsl_Color(int color, iHSLColor hsl) {
     set_Color(color, rgb_HSLColor(hsl));
 }
 
+void            setThemePalette_Color   (enum iColorTheme theme);
+
 iColor          ansi_Color      (iRangecc escapeSequence, int fallback);
 const char *    escape_Color    (int color);
diff --git a/src/ui/documentwidget.c b/src/ui/documentwidget.c
index 891e7650..ae828367 100644
--- a/src/ui/documentwidget.c
+++ b/src/ui/documentwidget.c
@@ -329,7 +329,7 @@ const iString *bookmarkTitle_DocumentWidget(const iDocumentWidget *d) {
     if (!isEmpty_String(d->titleUser)) {
         pushBack_StringArray(title, d->titleUser);
     }
-    else {
+    if (isEmpty_StringArray(title)) {
         iUrl parts;
         init_Url(&parts, d->mod.url);
         if (!isEmpty_Range(&parts.host)) {
@@ -693,11 +693,11 @@ static void checkResponse_DocumentWidget_(iDocumentWidget *d) {
                 iWidget *dlg = makeValueInput_Widget(
                     as_Widget(d),
                     NULL,
-                    format_CStr(cyan_ColorEscape "%s", cstr_Rangecc(parts.host)),
+                    format_CStr(uiHeading_ColorEscape "%s", cstr_Rangecc(parts.host)),
                     isEmpty_String(meta_GmRequest(d->request))
                         ? format_CStr("Please enter input for %s:", cstr_Rangecc(parts.path))
                         : cstr_String(meta_GmRequest(d->request)),
-                    orange_ColorEscape "Send \u21d2",
+                    uiTextCaution_ColorEscape "Send \u21d2",
                     "document.input.submit");
                 setSensitive_InputWidget(findChild_Widget(dlg, "input"),
                                          statusCode == sensitiveInput_GmStatusCode);
@@ -834,7 +834,7 @@ static iBool handleMediaCommand_DocumentWidget_(iDocumentWidget *d, const char *
         }
         else {
             const iGmError *err = get_GmError(code);
-            makeMessage_Widget(format_CStr(orange_ColorEscape "%s", err->title), err->info);
+            makeMessage_Widget(format_CStr(uiTextCaution_ColorEscape "%s", err->title), err->info);
             removeMediaRequest_DocumentWidget_(d, req->linkId);
         }
         return iTrue;
@@ -864,6 +864,9 @@ static iBool handleCommand_DocumentWidget_(iDocumentWidget *d, const char *cmd)
         refresh_Widget(w);
         updateWindowTitle_DocumentWidget_(d);
     }
+    else if (equal_Command(cmd, "theme.changed")) {
+        updateTheme_DocumentWidget_(d);
+    }
     else if (equal_Command(cmd, "tabs.changed")) {
         if (cmp_String(id_Widget(w), suffixPtr_Command(cmd, "id")) == 0) {
             /* Set palette for our document. */
@@ -879,18 +882,18 @@ static iBool handleCommand_DocumentWidget_(iDocumentWidget *d, const char *cmd)
         const char *unchecked = red_ColorEscape   "\u2610";
         const char *checked   = green_ColorEscape "\u2611";
         makeMessage_Widget(
-            cyan_ColorEscape "CERTIFICATE STATUS",
+            uiHeading_ColorEscape "CERTIFICATE STATUS",
             format_CStr("%s%s  Domain name %s%s\n"
                         "%s%s  %s (%04d-%02d-%02d %02d:%02d:%02d)\n"
                         "%s%s  %s",
                         d->certFlags & domainVerified_GmCertFlag ? checked : unchecked,
-                        gray75_ColorEscape,
+                        uiText_ColorEscape,
                         d->certFlags & domainVerified_GmCertFlag ? "matches" : "mismatch",
                         ~d->certFlags & domainVerified_GmCertFlag
                             ? format_CStr(" (%s)", cstr_String(d->certSubject))
                             : "",
                         d->certFlags & timeVerified_GmCertFlag ? checked : unchecked,
-                        gray75_ColorEscape,
+                        uiText_ColorEscape,
                         d->certFlags & timeVerified_GmCertFlag ? "Not expired" : "Expired",
                         d->certExpiry.year,
                         d->certExpiry.month,
@@ -899,7 +902,7 @@ static iBool handleCommand_DocumentWidget_(iDocumentWidget *d, const char *cmd)
                         d->certExpiry.minute,
                         d->certExpiry.second,
                         d->certFlags & trusted_GmCertFlag ? checked : unchecked,
-                        gray75_ColorEscape,
+                        uiText_ColorEscape,
                         d->certFlags & trusted_GmCertFlag ? "Trusted on first use"
                                                           : "Not trusted"));
         return iTrue;
@@ -1409,7 +1412,7 @@ static void drawRun_DrawContext_(void *context, const iGmRun *run) {
                 if (tx + textSize.x > right_Rect(d->widgetBounds)) {
                     tx = right_Rect(d->widgetBounds) - textSize.x;
                     fillRect_Paint(&d->paint, (iRect){ init_I2(tx, top_Rect(linkRect)), textSize },
-                                   black_ColorId);
+                                   uiBackground_ColorId);
                     msg += 4; /* skip the space and dash */
                     tx += measure_Text(metaFont, " \u2014").x / 2;
                 }
diff --git a/src/ui/inputwidget.c b/src/ui/inputwidget.c
index 305b8c9b..66e2af0a 100644
--- a/src/ui/inputwidget.c
+++ b/src/ui/inputwidget.c
@@ -1,6 +1,7 @@
 #include "inputwidget.h"
 #include "paint.h"
 #include "util.h"
+#include "app.h"
 
 #include <the_Foundation/array.h>
 #include <SDL_clipboard.h>
@@ -291,13 +292,13 @@ static iBool processEvent_InputWidget_(iInputWidget *d, const SDL_Event *ev) {
 static const iChar sensitiveChar_ = 0x25cf; /* black circle */
 
 static void draw_InputWidget_(const iInputWidget *d) {
-    const iWidget *w      = constAs_Widget(d);
-    const uint32_t time   = frameTime_Window(get_Window());
-    const iInt2 padding   = init_I2(gap_UI / 2, gap_UI / 2);
-    iRect       bounds    = adjusted_Rect(bounds_Widget(w), padding, neg_I2(padding));
-    const iBool isFocused = isFocused_Widget(w);
-    const iBool isHover   = isHover_Widget(w) &&
-                            contains_Widget(w, mouseCoord_Window(get_Window()));
+    const iWidget *w         = constAs_Widget(d);
+    const uint32_t time      = frameTime_Window(get_Window());
+    const iInt2    padding   = init_I2(gap_UI / 2, gap_UI / 2);
+    iRect          bounds    = adjusted_Rect(bounds_Widget(w), padding, neg_I2(padding));
+    const iBool    isFocused = isFocused_Widget(w);
+    const iBool    isHover   = isHover_Widget(w) &&
+                               contains_Widget(w, mouseCoord_Window(get_Window()));
     iPaint p;
     init_Paint(&p);
     iString text;
@@ -310,10 +311,13 @@ static void draw_InputWidget_(const iInputWidget *d) {
             appendChar_String(&text, sensitiveChar_);
         }
     }
-    fillRect_Paint(&p, bounds, black_ColorId);
-    drawRect_Paint(&p,
-                   adjusted_Rect(bounds, neg_I2(one_I2()), zero_I2()),
-                   isFocused ? orange_ColorId : isHover ? cyan_ColorId : gray50_ColorId);
+    fillRect_Paint(
+        &p, bounds, isFocused ? uiInputBackgroundFocused_ColorId : uiInputBackground_ColorId);
+    drawRectThickness_Paint(&p,
+                            adjusted_Rect(bounds, neg_I2(one_I2()), zero_I2()),
+                            isFocused ? gap_UI / 4 : 1,
+                            isFocused ? uiInputFrameFocused_ColorId
+                                      : isHover ? uiInputFrameHover_ColorId : uiInputFrame_ColorId);
     setClip_Paint(&p, bounds);
     shrink_Rect(&bounds, init_I2(gap_UI * (flags_Widget(w) & tight_WidgetFlag ? 1 : 2), 0));
     const iInt2 emSize    = advance_Text(d->font, "M");
@@ -332,7 +336,7 @@ static void draw_InputWidget_(const iInputWidget *d) {
     const int yOff = (height_Rect(bounds) - lineHeight_Text(d->font)) / 2;
     draw_Text(d->font,
               add_I2(topLeft_Rect(bounds), init_I2(xOff, yOff)),
-              white_ColorId,
+              isFocused ? uiInputTextFocused_ColorId : uiInputText_ColorId,
               "%s",
               cstr_String(&text));
     unsetClip_Paint(&p);
@@ -354,8 +358,8 @@ static void draw_InputWidget_(const iInputWidget *d) {
         else {
             initCStr_String(&cur, " ");
         }
-        fillRect_Paint(&p, curRect, orange_ColorId);
-        draw_Text(d->font, curPos, black_ColorId, cstr_String(&cur));
+        fillRect_Paint(&p, curRect, uiInputCursor_ColorId);
+        draw_Text(d->font, curPos, uiInputCursorText_ColorId, cstr_String(&cur));
         deinit_String(&cur);
     }
     deinit_String(&text);
diff --git a/src/ui/labelwidget.c b/src/ui/labelwidget.c
index 0c9269d1..62eb9853 100644
--- a/src/ui/labelwidget.c
+++ b/src/ui/labelwidget.c
@@ -122,60 +122,79 @@ static void keyStr_LabelWidget_(const iLabelWidget *d, iString *str) {
     }
 }
 
-static void draw_LabelWidget_(const iLabelWidget *d) {
-    const iWidget *w = constAs_Widget(d);
-    draw_Widget(w);
-    const iBool isButton = d->click.button != 0;
-    const int   flags    = flags_Widget(w);
-    const iRect bounds   = bounds_Widget(w);
-    iRect       rect     = bounds;
-    if (isButton) {
-        shrink_Rect(&rect, divi_I2(gap2_UI, 4));
-        adjustEdges_Rect(&rect, gap_UI / 8, 0, -gap_UI / 8, 0);
-    }
-    iPaint p;
-    init_Paint(&p);
-    int bg      = 0;
-    int fg      = gray75_ColorId;
-    int frame   = isButton ? gray50_ColorId : gray25_ColorId;
-    int frame2  = isButton ? black_ColorId : frame;
-    if (flags & selected_WidgetFlag) {
-        bg = teal_ColorId;
-        fg = white_ColorId;
-        frame = isButton ? cyan_ColorId : frame;
+static void getColors_LabelWidget_(const iLabelWidget *d, int *bg, int *fg, int *frame1, int *frame2) {
+    const iWidget *w           = constAs_Widget(d);
+    const iBool    isPress     = (flags_Widget(w) & pressed_WidgetFlag) != 0;
+    const iBool    isSel       = (flags_Widget(w) & selected_WidgetFlag) != 0;
+    const iBool    isFrameless = (flags_Widget(w) & frameless_WidgetFlag) != 0;
+    const iBool    isButton    = d->click.button != 0;
+    /* Default color state. */
+    *bg     = isButton ? uiBackground_ColorId : none_ColorId;
+    *fg     = uiText_ColorId;
+    *frame1 = isButton ? uiEmboss1_ColorId : uiFrame_ColorId;
+    *frame2 = isButton ? uiEmboss2_ColorId : *frame1;
+    if (isSel) {
+        *bg = uiBackgroundSelected_ColorId;
+        *fg = uiTextSelected_ColorId;
+        if (isButton) {
+            *frame1 = uiEmbossSelected1_ColorId;
+            *frame2 = uiEmbossSelected2_ColorId;
+        }
     }
     if (isHover_Widget(w)) {
-        if (flags & frameless_WidgetFlag) {
-            bg = teal_ColorId;
-            fg = white_ColorId;
-            if (isButton && flags & selected_WidgetFlag) frame = white_ColorId;
+        if (isFrameless) {
+            *bg = uiBackgroundFramelessHover_ColorId;
+            *fg = uiTextFramelessHover_ColorId;
         }
         else {
-            if (frame != cyan_ColorId) {
-                if (startsWith_String(&d->label, orange_ColorEscape)) {
-                    frame = orange_ColorId;
-                    frame2 = brown_ColorId;
+            /* Frames matching color escaped text. */
+            if (startsWith_String(&d->label, "\r")) {
+                if (colorTheme_App() == dark_ColorTheme) {
+                    *frame1 = cstr_String(&d->label)[1] - '0';
+                    *frame2 = darker_Color(*frame1);
                 }
                 else {
-                    frame  = cyan_ColorId;
-                    frame2 = teal_ColorId;
+                    *bg = *frame1 = *frame2 = cstr_String(&d->label)[1] - '0';
+                    *fg = uiBackground_ColorId | permanent_ColorId;
                 }
             }
+            else if (isSel) {
+                *frame1 = uiEmbossSelectedHover1_ColorId;
+                *frame2 = uiEmbossSelectedHover2_ColorId;
+            }
             else {
-                frame  = white_ColorId;
-                frame2 = cyan_ColorId;
+                if (isButton) *bg = uiBackgroundHover_ColorId;
+                *frame1 = uiEmbossHover1_ColorId;
+                *frame2 = uiEmbossHover2_ColorId;
             }
         }
     }
-    if (flags & pressed_WidgetFlag) {
-        bg = orange_ColorId | permanent_ColorId;
+    if (isPress) {
+        *bg = uiBackgroundPressed_ColorId | permanent_ColorId;
         if (isButton) {
-            frame = brown_ColorId;
-            frame2 = white_ColorId;
+            *frame1 = uiEmbossPressed1_ColorId;
+            *frame2 = uiEmbossPressed2_ColorId;
         }
-        fg = black_ColorId | permanent_ColorId;
+        *fg = uiTextPressed_ColorId | permanent_ColorId;
     }
-    if (bg) {
+}
+
+static void draw_LabelWidget_(const iLabelWidget *d) {
+    const iWidget *w = constAs_Widget(d);
+    draw_Widget(w);
+    const iBool isButton = d->click.button != 0;
+    const int   flags    = flags_Widget(w);
+    const iRect bounds   = bounds_Widget(w);
+    iRect       rect     = bounds;
+    if (isButton) {
+        shrink_Rect(&rect, divi_I2(gap2_UI, 4));
+        adjustEdges_Rect(&rect, gap_UI / 8, 0, -gap_UI / 8, 0);
+    }
+    iPaint p;
+    init_Paint(&p);
+    int bg, fg, frame, frame2;
+    getColors_LabelWidget_(d, &bg, &fg, &frame, &frame2);
+    if (bg >= 0) {
         fillRect_Paint(&p, rect, bg);
     }
     if (~flags & frameless_WidgetFlag) {
@@ -201,7 +220,7 @@ static void draw_LabelWidget_(const iLabelWidget *d) {
             keyStr_LabelWidget_(d, &str);
             drawAlign_Text(uiShortcuts_FontId,
                            add_I2(topRight_Rect(bounds), negX_I2(padding_(flags))),
-                           flags & pressed_WidgetFlag ? fg : cyan_ColorId,
+                           flags & pressed_WidgetFlag ? fg : uiTextShortcut_ColorId,
                            right_Alignment,
                            cstr_String(&str));
             deinit_String(&str);
diff --git a/src/ui/scrollwidget.c b/src/ui/scrollwidget.c
index d43a1fad..944c9ebe 100644
--- a/src/ui/scrollwidget.c
+++ b/src/ui/scrollwidget.c
@@ -114,9 +114,10 @@ static void draw_ScrollWidget_(const iScrollWidget *d) {
     if (bounds.size.x > 0) {
         iPaint p;
         init_Paint(&p);
-        drawRect_Paint(&p, bounds, black_ColorId);
+//        drawRect_Paint(&p, bounds, black_ColorId);
+        drawVLine_Paint(&p, topLeft_Rect(bounds), height_Rect(bounds), uiSeparator_ColorId);
         const iRect thumbRect = shrunk_Rect(thumbRect_ScrollWidget_(d), init_I2(gap_UI, gap_UI / 2));
-        fillRect_Paint(&p, thumbRect, isPressed ? orange_ColorId : tmQuote_ColorId);
+        fillRect_Paint(&p, thumbRect, isPressed ? uiBackgroundPressed_ColorId : tmQuote_ColorId);
     }
 }
 
diff --git a/src/ui/sidebarwidget.c b/src/ui/sidebarwidget.c
index 7d0e8b42..de3cfd86 100644
--- a/src/ui/sidebarwidget.c
+++ b/src/ui/sidebarwidget.c
@@ -102,6 +102,10 @@ static void updateVisible_SidebarWidget_(iSidebarWidget *d) {
                                           : 0);
 }
 
+static int cmpTitle_Bookmark_(const iBookmark **a, const iBookmark **b) {
+    return cmpStringCase_String(&(*a)->title, &(*b)->title);
+}
+
 static void updateItems_SidebarWidget_(iSidebarWidget *d) {
     clearItems_SidebarWidget_(d);
     destroy_Widget(d->menu);
@@ -122,7 +126,7 @@ static void updateItems_SidebarWidget_(iSidebarWidget *d) {
             break;
         }
         case bookmarks_SidebarMode: {
-            iConstForEach(PtrArray, i, list_Bookmarks(bookmarks_App(), NULL, NULL)) {
+            iConstForEach(PtrArray, i, list_Bookmarks(bookmarks_App(), NULL, cmpTitle_Bookmark_)) {
                 const iBookmark *bm = i.ptr;
                 iSidebarItem item;
                 init_SidebarItem(&item);
@@ -130,11 +134,12 @@ static void updateItems_SidebarWidget_(iSidebarWidget *d) {
                 item.icon = bm->icon;
                 set_String(&item.url, &bm->url);
                 set_String(&item.label, &bm->title);
-                iDate date;
-                init_Date(&date, &bm->when);
-                iString *ds = format_Date(&date, "%Y %b %d");
-                set_String(&item.meta, ds);
-                delete_String(ds);
+//                iDate date;
+//                init_Date(&date, &bm->when);
+//                iString *ds = format_Date(&date, "%Y %b %d");
+//                set_String(&item.meta, ds);
+                set_String(&item.meta, &bm->tags);
+//                delete_String(ds);
                 pushBack_Array(&d->items, &item);
             }
             d->menu = makeMenu_Widget(
@@ -142,7 +147,7 @@ static void updateItems_SidebarWidget_(iSidebarWidget *d) {
                 (iMenuItem[]){ { "Edit Bookmark...", 0, 0, "bookmark.edit" },
                                { "Copy URL", 0, 0, "bookmark.copy" },
                                { "---", 0, 0, NULL },
-                               { orange_ColorEscape "Delete Bookmark", 0, 0, "bookmark.delete" } },
+                               { uiTextCaution_ColorEscape "Delete Bookmark", 0, 0, "bookmark.delete" } },
                 4);
             break;
         }
@@ -161,7 +166,7 @@ void setMode_SidebarWidget(iSidebarWidget *d, enum iSidebarMode mode) {
     for (enum iSidebarMode i = 0; i < max_SidebarMode; i++) {
         setFlags_Widget(as_Widget(d->modeButtons[i]), selected_WidgetFlag, i == d->mode);
     }
-    const float heights[max_SidebarMode] = { 1.2f, 2.4f, 3, 3 };
+    const float heights[max_SidebarMode] = { 1.2f, 1.5f, 3, 3 };
     d->itemHeight = heights[mode] * lineHeight_Text(default_FontId);
 }
 
@@ -351,7 +356,7 @@ static iBool processEvent_SidebarWidget_(iSidebarWidget *d, const SDL_Event *ev)
             if (argLabel_Command(cmd, "button") == SDL_BUTTON_LEFT) {
                 if (arg_Command(cmd)) {
                     setFlags_Widget(d->resizer, pressed_WidgetFlag, iTrue);
-                    setBackgroundColor_Widget(d->resizer, gray75_ColorId);
+                    setBackgroundColor_Widget(d->resizer, uiBackgroundFramelessHover_ColorId);
                     setMouseGrab_Widget(d->resizer);
                     refresh_Widget(d->resizer);
                 }
@@ -420,6 +425,7 @@ static iBool processEvent_SidebarWidget_(iSidebarWidget *d, const SDL_Event *ev)
                 setText_InputWidget(findChild_Widget(dlg, "bmed.url"), &bm->url);
                 setText_InputWidget(findChild_Widget(dlg, "bmed.tags"), &bm->tags);
                 setCommandHandler_Widget(dlg, handleBookmarkEditorCommands_SidebarWidget_);
+                setFocus_Widget(findChild_Widget(dlg, "bmed.title"));
             }
             return iTrue;
         }
@@ -500,35 +506,41 @@ static void draw_SidebarWidget_(const iSidebarWidget *d) {
             const iBool         isHover     = (d->hoverItem == i);
             setClip_Paint(&p, intersect_Rect(itemRect, bounds));
             if (isHover) {
-                fillRect_Paint(&p, itemRect, isPressing ? orange_ColorId : teal_ColorId);
+                fillRect_Paint(&p,
+                               itemRect,
+                               isPressing ? uiBackgroundPressed_ColorId
+                                          : uiBackgroundFramelessHover_ColorId);
             }
             if (d->mode == documentOutline_SidebarMode) {
-                const int fg = isHover ? (isPressing ? black_ColorId : white_ColorId) :
-                                       (item->indent == 0 ? white_ColorId : gray75_ColorId);
+                const int fg =
+                    isHover ? (isPressing ? uiTextPressed_ColorId : uiTextFramelessHover_ColorId)
+                            : (item->indent == 0 ? uiTextStrong_ColorId : uiText_ColorId);
                 drawRange_Text(font, init_I2(pos.x + 3 * gap_UI + item->indent,
                                         mid_Rect(itemRect).y - lineHeight_Text(font) / 2),
                                fg, range_String(&item->label));
             }
             else if (d->mode == bookmarks_SidebarMode) {
                 const int fg =
-                    isHover ? (isPressing ? black_ColorId : white_ColorId) : gray75_ColorId;
+                    isHover ? (isPressing ? uiTextPressed_ColorId : uiTextFramelessHover_ColorId)
+                            : uiText_ColorId;
                 iString str;
                 init_String(&str);
                 appendChar_String(&str, item->icon ? item->icon : 0x1f588);
-                const iRect iconArea = { pos, init_I2(10 * gap_UI, d->itemHeight) };
-                drawCentered_Text(uiBookmarkIcon_FontId,
+                const iRect iconArea = { addX_I2(pos, gap_UI), init_I2(7 * gap_UI, d->itemHeight) };
+                drawCentered_Text(font,
                                   iconArea,
                                   iTrue,
-                                  isHover && isPressing ? black_ColorId : cyan_ColorId,
+                                  isHover && isPressing ? uiTextPressed_ColorId : uiIcon_ColorId,
                                   "%s",
                                   cstr_String(&str));
                 deinit_String(&str);
-                iInt2 textPos = addY_I2(topRight_Rect(iconArea), 0.2f * lineHeight_Text(font));
+                iInt2 textPos =
+                    addY_I2(topRight_Rect(iconArea), (d->itemHeight - lineHeight_Text(font)) / 2);
                 drawRange_Text(font, textPos, fg, range_String(&item->label));
-                drawRange_Text(font,
+                /*drawRange_Text(font,
                                addY_I2(textPos, lineHeight_Text(font)),
                                isHover ? (isPressing ? black_ColorId : cyan_ColorId) : teal_ColorId,
-                               range_String(&item->meta));
+                               range_String(&item->meta));*/
             }
             unsetClip_Paint(&p);
             pos.y += d->itemHeight;
@@ -538,7 +550,7 @@ static void draw_SidebarWidget_(const iSidebarWidget *d) {
     drawVLine_Paint(&p,
                     addX_I2(topRight_Rect(bounds_Widget(w)), -1),
                     height_Rect(bounds_Widget(w)),
-                    black_ColorId);
+                    uiSeparator_ColorId);
 }
 
 iBeginDefineSubclass(SidebarWidget, Widget)
diff --git a/src/ui/util.c b/src/ui/util.c
index 05b3c930..e638e596 100644
--- a/src/ui/util.c
+++ b/src/ui/util.c
@@ -126,6 +126,7 @@ iWidget *makePadding_Widget(int size) {
 iLabelWidget *makeHeading_Widget(const char *text) {
     iLabelWidget *heading = new_LabelWidget(text, 0, 0, NULL);
     setFlags_Widget(as_Widget(heading), frameless_WidgetFlag | fixedSize_WidgetFlag, iTrue);
+    setBackgroundColor_Widget(as_Widget(heading), none_ColorId);
     return heading;
 }
 
@@ -166,7 +167,7 @@ static iBool menuHandler_(iWidget *menu, const char *cmd) {
 iWidget *makeMenu_Widget(iWidget *parent, const iMenuItem *items, size_t n) {
     iWidget *menu = new_Widget();
     setFrameColor_Widget(menu, black_ColorId);
-    setBackgroundColor_Widget(menu, gray25_ColorId);
+    setBackgroundColor_Widget(menu, uiBackground_ColorId);
     setFlags_Widget(menu,
                     keepOnTop_WidgetFlag | collapse_WidgetFlag | hidden_WidgetFlag |
                         arrangeVertical_WidgetFlag | arrangeSize_WidgetFlag |
@@ -477,7 +478,7 @@ iWidget *makeSheet_Widget(const char *id) {
     iWidget *sheet = new_Widget();
     setId_Widget(sheet, id);
     setFrameColor_Widget(sheet, black_ColorId);
-    setBackgroundColor_Widget(sheet, gray25_ColorId);
+    setBackgroundColor_Widget(sheet, uiBackground_ColorId);
     setFlags_Widget(
         sheet, keepOnTop_WidgetFlag | arrangeVertical_WidgetFlag | arrangeHeight_WidgetFlag, iTrue);
     const iInt2 rootSize = rootSize_Window(get_Window());
@@ -600,7 +601,7 @@ iWidget *makeValueInput_Widget(iWidget *parent, const iString *initialValue, con
         setFlags_Widget(div, arrangeHorizontal_WidgetFlag | arrangeSize_WidgetFlag, iTrue);
         addChild_Widget(div, iClob(new_LabelWidget("Cancel", SDLK_ESCAPE, 0, "cancel")));
         addChild_Widget(div,
-                        iClob(new_LabelWidget(acceptLabel ? acceptLabel : cyan_ColorEscape "OK",
+                        iClob(new_LabelWidget(acceptLabel ? acceptLabel : uiTextAction_ColorEscape "OK",
                                               SDLK_RETURN,
                                               0,
                                               "valueinput.accept")));
@@ -641,8 +642,8 @@ iWidget *makeQuestion_Widget(const char *title,
 //    processEvents_App(postedEventsOnly_AppEventMode);
     iWidget *dlg = makeSheet_Widget("");
     setCommandHandler_Widget(dlg, messageHandler_);
-    addChild_Widget(dlg, iClob(new_LabelWidget(title, 0, 0, NULL)));
-    addChild_Widget(dlg, iClob(new_LabelWidget(msg, 0, 0, NULL)));
+    addChildFlags_Widget(dlg, iClob(new_LabelWidget(title, 0, 0, NULL)), frameless_WidgetFlag);
+    addChildFlags_Widget(dlg, iClob(new_LabelWidget(msg, 0, 0, NULL)), frameless_WidgetFlag);
     addChild_Widget(dlg, iClob(makePadding_Widget(gap_UI)));
     iWidget *div = new_Widget(); {
         setFlags_Widget(div, arrangeHorizontal_WidgetFlag | arrangeSize_WidgetFlag, iTrue);
@@ -685,14 +686,25 @@ iWidget *makeToggle_Widget(const char *id) {
 
 iWidget *makePreferences_Widget(void) {
     iWidget *dlg = makeSheet_Widget("prefs");
-    addChild_Widget(dlg, iClob(new_LabelWidget(cyan_ColorEscape "PREFERENCES", 0, 0, NULL)));
+    addChildFlags_Widget(dlg,
+                         iClob(new_LabelWidget(uiHeading_ColorEscape "PREFERENCES", 0, 0, NULL)),
+                         frameless_WidgetFlag);
     iWidget *page = new_Widget();
     addChild_Widget(dlg, iClob(page));
     setFlags_Widget(page, arrangeHorizontal_WidgetFlag | arrangeSize_WidgetFlag, iTrue);
     iWidget *headings = addChildFlags_Widget(
-        page, iClob(new_Widget()), arrangeVertical_WidgetFlag | arrangeSize_WidgetFlag);
+        page, iClob(new_Widget()), arrangeVertical_WidgetFlag | arrangeSize_WidgetFlag);    
     iWidget *values = addChildFlags_Widget(
         page, iClob(new_Widget()), arrangeVertical_WidgetFlag | arrangeSize_WidgetFlag);
+//    setBackgroundColor_Widget(headings, none_ColorId);
+//    setBackgroundColor_Widget(values, none_ColorId);
+    addChild_Widget(headings, iClob(makeHeading_Widget("Theme:")));
+    iWidget *themes = new_Widget();
+    /* Themes. */ {
+        setId_Widget(addChild_Widget(themes, iClob(new_LabelWidget("Dark", 0, 0, "theme.set arg:0"))), "prefs.theme.0");
+        setId_Widget(addChild_Widget(themes, iClob(new_LabelWidget("Light", 0, 0, "theme.set arg:1"))), "prefs.theme.1");
+    }
+    addChildFlags_Widget(values, iClob(themes), arrangeHorizontal_WidgetFlag | arrangeSize_WidgetFlag);
     addChild_Widget(headings, iClob(makeHeading_Widget("Retain window size:")));
     addChild_Widget(values, iClob(makeToggle_Widget("prefs.retainwindow")));
     addChild_Widget(headings, iClob(makeHeading_Widget("UI scale factor:")));
@@ -711,7 +723,9 @@ iWidget *makePreferences_Widget(void) {
 
 iWidget *makeBookmarkEditor_Widget(void) {
     iWidget *dlg = makeSheet_Widget("bmed");
-    addChild_Widget(dlg, iClob(new_LabelWidget(cyan_ColorEscape "EDIT BOOKMARK", 0, 0, NULL)));
+    addChildFlags_Widget(dlg,
+                         iClob(new_LabelWidget(uiHeading_ColorEscape "EDIT BOOKMARK", 0, 0, NULL)),
+                         frameless_WidgetFlag);
     iWidget *page = new_Widget();
     addChild_Widget(dlg, iClob(page));
     setFlags_Widget(page, arrangeHorizontal_WidgetFlag | arrangeSize_WidgetFlag, iTrue);
@@ -720,13 +734,16 @@ iWidget *makeBookmarkEditor_Widget(void) {
     iWidget *values = addChildFlags_Widget(
         page, iClob(new_Widget()), arrangeVertical_WidgetFlag | arrangeSize_WidgetFlag);
     iInputWidget *inputs[4];
-    addChild_Widget(headings, iClob(makeHeading_Widget("Title:")));
+    iWidget *hd;
+    addChild_Widget(headings, iClob(hd = makeHeading_Widget("Title:")));
     setId_Widget(addChild_Widget(values, iClob(inputs[0] = new_InputWidget(0))), "bmed.title");
     addChild_Widget(headings, iClob(makeHeading_Widget("URL:")));
     setId_Widget(addChild_Widget(values, iClob(inputs[1] = new_InputWidget(0))), "bmed.url");
     addChild_Widget(headings, iClob(makeHeading_Widget("Tags:")));
     setId_Widget(addChild_Widget(values, iClob(inputs[2] = new_InputWidget(0))), "bmed.tags");
     arrange_Widget(dlg);
+    /* TODO: Heights don't match here. */
+    printf("hd:%d inp:%d\n", hd->rect.size.y, as_Widget(inputs[0])->rect.size.y); fflush(stdout);
     for (int i = 0; i < 3; ++i) {
         as_Widget(inputs[i])->rect.size.x = dlg->rect.size.x - headings->rect.size.x - 3 * gap_UI;
     }
@@ -736,7 +753,7 @@ iWidget *makeBookmarkEditor_Widget(void) {
         addChild_Widget(
             div,
             iClob(new_LabelWidget(
-                orange_ColorEscape "Save", SDLK_RETURN, KMOD_PRIMARY, "bmed.accept")));
+                uiTextCaution_ColorEscape "Save", SDLK_RETURN, KMOD_PRIMARY, "bmed.accept")));
     }
     addChild_Widget(dlg, iClob(div));
     addChild_Widget(get_Window()->root, iClob(dlg));
diff --git a/src/ui/window.c b/src/ui/window.c
index 5e1ad9c6..8760d36f 100644
--- a/src/ui/window.c
+++ b/src/ui/window.c
@@ -121,7 +121,7 @@ static const iMenuItem helpMenuItems[] = {
 #endif
 
 static const char *reloadCStr_ = "\U0001f503";
-static const char *stopCStr_   = orange_ColorEscape "\U0001f310";
+static const char *stopCStr_   = uiTextCaution_ColorEscape "\U0001f310";
 
 static iBool handleNavBarCommands_(iWidget *navBar, const char *cmd) {
     if (equal_Command(cmd, "window.resized")) {
@@ -266,7 +266,7 @@ static void setupUserInterface_Window(iWindow *d) {
                             arrangeHorizontal_WidgetFlag,
                         iTrue);
         addChild_Widget(div, iClob(navBar));
-        setBackgroundColor_Widget(navBar, gray25_ColorId);
+        setBackgroundColor_Widget(navBar, uiBackground_ColorId);
         setCommandHandler_Widget(navBar, handleNavBarCommands_);
         addChild_Widget(navBar, iClob(newIcon_LabelWidget("\U0001f850", 0, 0, "navigate.back")));
         addChild_Widget(navBar, iClob(newIcon_LabelWidget("\U0001f852", 0, 0, "navigate.forward")));
@@ -303,7 +303,7 @@ static void setupUserInterface_Window(iWindow *d) {
         iWidget *tabBar = makeTabs_Widget(div);
         setId_Widget(tabBar, "doctabs");
         setFlags_Widget(tabBar, expand_WidgetFlag, iTrue);
-        setBackgroundColor_Widget(tabBar, gray25_ColorId);
+        setBackgroundColor_Widget(tabBar, uiBackground_ColorId);
         appendTabPage_Widget(tabBar, iClob(new_DocumentWidget()), "Document", 0, 0);
         iWidget *buttons = findChild_Widget(tabBar, "tabs.buttons");
         setFlags_Widget(buttons, collapse_WidgetFlag | hidden_WidgetFlag, iTrue);
@@ -324,7 +324,7 @@ static void setupUserInterface_Window(iWindow *d) {
                             resizeChildren_WidgetFlag | arrangeHorizontal_WidgetFlag,
                         iTrue);
         addChild_Widget(div, iClob(searchBar));
-        setBackgroundColor_Widget(searchBar, gray25_ColorId);
+        setBackgroundColor_Widget(searchBar, uiBackground_ColorId);
         setCommandHandler_Widget(searchBar, handleSearchBarCommands_);
         addChild_Widget(searchBar, iClob(new_LabelWidget("\U0001f50d Text", 0, 0, NULL)));
         iInputWidget *input = new_InputWidget(0);
@@ -372,7 +372,7 @@ static float pixelRatio_Window_(const iWindow *d) {
 }
 
 static void drawBlank_Window_(iWindow *d) {
-    const iColor bg = get_Color(gray25_ColorId);
+    const iColor bg = get_Color(uiBackground_ColorId);
     SDL_SetRenderDrawColor(d->render, bg.r, bg.g, bg.b, 255);
     SDL_RenderClear(d->render);
     SDL_RenderPresent(d->render);