ui: dark theme support, setup by default from system, settings

src/gui/app.rs

@@ -18,7 +18,6 @@ use egui::{Context, Modifiers};
 use lazy_static::lazy_static;
 
 use crate::AppConfig;
-use crate::gui::Colors;
 use crate::gui::platform::PlatformCallbacks;
 use crate::gui::views::Root;
 
@@ -75,7 +74,6 @@ impl<Platform: PlatformCallbacks> eframe::App for PlatformApp<Platform> {
         // Show main content.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                fill: Colors::YELLOW,
                 ..Default::default()
             })
             .show(ctx, |ui| {

src/gui/colors.rs

@@ -14,29 +14,236 @@
 
 use egui::Color32;
 
+use crate::AppConfig;
+
+/// Provides colors values based on current theme.
 pub struct Colors;
 
-impl Colors {
-    pub const WHITE: Color32 = Color32::from_gray(253);
-    pub const BLACK: Color32 = Color32::from_gray(12);
-    pub const TRANSPARENT: Color32 = Color32::from_rgba_premultiplied(0, 0, 0, 0);
-    pub const SEMI_TRANSPARENT: Color32 = Color32::from_black_alpha(100);
-    pub const YELLOW: Color32 = Color32::from_rgb(254, 241, 2);
-    pub const GOLD: Color32 = Color32::from_rgb(255, 215, 0);
-    pub const GREEN: Color32 = Color32::from_rgb(0, 0x64, 0);
-    pub const RED: Color32 = Color32::from_rgb(0x8B, 0, 0);
-    pub const FILL: Color32 = Color32::from_gray(244);
-    pub const FILL_DARK: Color32 = Color32::from_gray(238);
-    pub const CHECKBOX: Color32 = Color32::from_gray(100);
-    pub const TEXT: Color32 = Color32::from_gray(80);
-    pub const TEXT_BUTTON: Color32 = Color32::from_gray(70);
-    pub const TITLE: Color32 = Color32::from_gray(60);
-    pub const BUTTON: Color32 = Color32::from_gray(249);
-    pub const GRAY: Color32 = Color32::from_gray(120);
-    pub const STROKE: Color32 = Color32::from_gray(200);
-    pub const INACTIVE_TEXT: Color32 = Color32::from_gray(150);
-    pub const ITEM_BUTTON: Color32 = Color32::from_gray(90);
-    pub const ITEM_STROKE: Color32 = Color32::from_gray(220);
-    pub const ITEM_HOVER: Color32 = Color32::from_gray(205);
-    pub const ITEM_CURRENT: Color32 = Color32::from_gray(227);
+const WHITE: Color32 = Color32::from_gray(253);
+const BLACK: Color32 = Color32::from_gray(12);
+
+const SEMI_TRANSPARENT: Color32 = Color32::from_black_alpha(100);
+const DARK_SEMI_TRANSPARENT: Color32 = Color32::from_black_alpha(170);
+
+const GOLD: Color32 = Color32::from_rgb(255, 215, 0);
+
+const YELLOW: Color32 = Color32::from_rgb(254, 241, 2);
+
+const GREEN: Color32 = Color32::from_rgb(0, 0x64, 0);
+
+const RED: Color32 = Color32::from_rgb(0x8B, 0, 0);
+
+const FILL: Color32 = Color32::from_gray(244);
+const FILL_DEEP: Color32 = Color32::from_gray(238);
+
+const FILL_DARK: Color32 = Color32::from_gray(24);
+const FILL_DEEP_DARK: Color32 = Color32::from_gray(18);
+
+const TEXT: Color32 = Color32::from_gray(80);
+const TEXT_DARK: Color32 = Color32::from_gray(185);
+
+const CHECKBOX: Color32 = Color32::from_gray(100);
+const CHECKBOX_DARK: Color32 = Color32::from_gray(175);
+
+const TEXT_BUTTON: Color32 = Color32::from_gray(70);
+const TEXT_BUTTON_DARK: Color32 = Color32::from_gray(195);
+
+const TITLE: Color32 = Color32::from_gray(60);
+const TITLE_DARK: Color32 = Color32::from_gray(205);
+
+const BUTTON: Color32 = Color32::from_gray(249);
+const BUTTON_DARK: Color32 = Color32::from_gray(16);
+
+const GRAY: Color32 = Color32::from_gray(120);
+const GRAY_DARK: Color32 = Color32::from_gray(145);
+
+const STROKE: Color32 = Color32::from_gray(200);
+const STROKE_DARK: Color32 = Color32::from_gray(65);
+
+const INACTIVE_TEXT: Color32 = Color32::from_gray(150);
+const INACTIVE_TEXT_DARK: Color32 = Color32::from_gray(115);
+
+const ITEM_BUTTON: Color32 = Color32::from_gray(90);
+const ITEM_BUTTON_DARK: Color32 = Color32::from_gray(175);
+
+const ITEM_STROKE: Color32 = Color32::from_gray(220);
+const ITEM_STROKE_DARK: Color32 = Color32::from_gray(45);
+
+const ITEM_HOVER: Color32 = Color32::from_gray(205);
+const ITEM_HOVER_DARK: Color32 = Color32::from_gray(60);
+
+const ITEM_CURRENT: Color32 = Color32::from_gray(227);
+const ITEM_CURRENT_DARK: Color32 = Color32::from_gray(38);
+
+/// Check if dark theme should be used.
+fn use_dark() -> bool {
+    AppConfig::dark_theme().unwrap_or(false)
 }
+
+impl Colors {
+    pub const TRANSPARENT: Color32 = Color32::from_rgba_premultiplied(0, 0, 0, 0);
+
+    pub fn white_or_black(black_in_white: bool) -> Color32 {
+        if use_dark() {
+            if black_in_white {
+                WHITE
+            } else {
+                BLACK
+            }
+        } else {
+            if black_in_white {
+                BLACK
+            } else {
+                WHITE
+            }
+        }
+    }
+
+    pub fn semi_transparent() -> Color32 {
+        if use_dark() {
+            DARK_SEMI_TRANSPARENT
+        } else {
+            SEMI_TRANSPARENT
+        }
+    }
+
+    pub fn gold() -> Color32 {
+        if use_dark() {
+            GOLD.linear_multiply(0.85)
+        } else {
+            GOLD
+        }
+    }
+
+    pub fn yellow() -> Color32 {
+        YELLOW
+    }
+
+    pub fn green() -> Color32 {
+        if use_dark() {
+            GREEN.linear_multiply(1.3)
+        } else {
+            GREEN
+        }
+    }
+
+    pub fn red() -> Color32 {
+        if use_dark() {
+            RED.linear_multiply(1.3)
+        } else {
+            RED
+        }
+    }
+
+    pub fn fill() -> Color32 {
+        if use_dark() {
+            FILL_DARK
+        } else {
+            FILL
+        }
+    }
+
+    pub fn fill_deep() -> Color32 {
+        if use_dark() {
+            FILL_DEEP_DARK
+        } else {
+            FILL_DEEP
+        }
+    }
+
+    pub fn checkbox() -> Color32 {
+        if use_dark() {
+            CHECKBOX_DARK
+        } else {
+            CHECKBOX
+        }
+    }
+
+    pub fn text(always_light: bool) -> Color32 {
+        if use_dark() && !always_light {
+            TEXT_DARK
+        } else {
+            TEXT
+        }
+    }
+
+    pub fn text_button() -> Color32 {
+        if use_dark() {
+            TEXT_BUTTON_DARK
+        } else {
+            TEXT_BUTTON
+        }
+    }
+
+    pub fn title(always_light: bool) -> Color32 {
+        if use_dark() && !always_light {
+            TITLE_DARK
+        } else {
+            TITLE
+        }
+    }
+
+    pub fn button() -> Color32 {
+        if use_dark() {
+            BUTTON_DARK
+        } else {
+            BUTTON
+        }
+    }
+
+    pub fn gray() -> Color32 {
+        if use_dark() {
+            GRAY_DARK
+        } else {
+            GRAY
+        }
+    }
+
+    pub fn stroke() -> Color32 {
+        if use_dark() {
+            STROKE_DARK
+        } else {
+            STROKE
+        }
+    }
+
+    pub fn inactive_text() -> Color32 {
+        if use_dark() {
+            INACTIVE_TEXT_DARK
+        } else {
+            INACTIVE_TEXT
+        }
+    }
+
+    pub fn item_button() -> Color32 {
+        if use_dark() {
+            ITEM_BUTTON_DARK
+        } else {
+            ITEM_BUTTON
+        }
+    }
+
+    pub fn item_stroke() -> Color32 {
+        if use_dark() {
+            ITEM_STROKE_DARK
+        } else {
+            ITEM_STROKE
+        }
+    }
+
+    pub fn item_hover() -> Color32 {
+        if use_dark() {
+            ITEM_HOVER_DARK
+        } else {
+            ITEM_HOVER
+        }
+    }
+
+    pub fn item_current() -> Color32 {
+        if use_dark() {
+            ITEM_CURRENT_DARK
+        } else {
+            ITEM_CURRENT
+        }
+    }
+}

src/gui/platform/android/mod.rs

@@ -27,25 +27,29 @@ use winit::platform::android::activity::AndroidApp;
 
 use crate::gui::platform::PlatformCallbacks;
 
+/// Android platform implementation.
 #[derive(Clone)]
 pub struct Android {
     android_app: AndroidApp,
 }
 
 impl Android {
+    /// Create new Android platform instance from provided [`AndroidApp`].
     pub fn new(app: AndroidApp) -> Self {
         Self {
             android_app: app,
         }
     }
-    fn call_java_method(&self, name: &str, sig: &str, args: &[JValue]) -> Option<jni::sys::jvalue> {
+
+    /// Call Android Activity method with JNI.
+    pub fn call_java_method(&self, name: &str, sig: &str, args: &[JValue]) -> Option<jni::sys::jvalue> {
         let vm = unsafe { jni::JavaVM::from_raw(self.android_app.vm_as_ptr() as _) }.unwrap();
         let mut env = vm.attach_current_thread().unwrap();
         let activity = unsafe {
             JObject::from_raw(self.android_app.activity_as_ptr() as jni::sys::jobject)
         };
         if let Ok(result) = env.call_method(activity, name, sig, args) {
-           return Some(result.as_jni().clone());
+            return Some(result.as_jni().clone());
         }
         None
     }
@@ -142,6 +146,7 @@ impl PlatformCallbacks for Android {
 }
 
 lazy_static! {
+    /// Last image data from camera.
     static ref LAST_CAMERA_IMAGE: Arc<RwLock<Option<(Vec<u8>, u32)>>> = Arc::new(RwLock::new(None));
 }
 

src/gui/views/camera.rs

@@ -114,7 +114,7 @@ impl CameraContent {
                     ui.vertical_centered(|ui| {
                         ui.label(RichText::new(format!("{}%", ur_progress))
                             .size(16.0)
-                            .color(Colors::YELLOW));
+                            .color(Colors::yellow()));
                     });
                 }
 
@@ -125,7 +125,7 @@ impl CameraContent {
                     size.y = 48.0;
                     ui.allocate_ui_with_layout(size, Layout::right_to_left(Align::Max), |ui| {
                         ui.add_space(4.0);
-                        View::button(ui, CAMERA_ROTATE.to_string(), Colors::WHITE, || {
+                        View::button(ui, CAMERA_ROTATE.to_string(), Colors::white_or_black(false), || {
                             cb.switch_camera();
                         });
                     });

src/gui/views/modal.rs

@@ -43,7 +43,7 @@ pub struct Modal {
 
 impl Modal {
     /// Margin from [`Modal`] window at top/left/right.
-    const DEFAULT_MARGIN: f32 = 10.0;
+    const DEFAULT_MARGIN: f32 = 6.0;
     /// Maximum width of the content.
     const DEFAULT_WIDTH: f32 = Root::SIDE_PANEL_WIDTH - (2.0 * Self::DEFAULT_MARGIN);
 
@@ -167,7 +167,7 @@ impl Modal {
             .collapsible(false)
             .fixed_rect(rect)
             .frame(egui::Frame {
-                fill: Colors::SEMI_TRANSPARENT,
+                fill: Colors::semi_transparent(),
                 ..Default::default()
             })
             .show(ctx, |ui| {
@@ -196,7 +196,7 @@ impl Modal {
                     color: egui::Color32::from_black_alpha(32),
                 },
                 rounding: Rounding::same(8.0),
-                fill: Colors::YELLOW,
+                fill: Colors::fill(),
                 ..Default::default()
             })
             .show(ctx, |ui| {
@@ -246,7 +246,7 @@ impl Modal {
         let mut bg_shape = RectShape {
             rect,
             rounding,
-            fill: Colors::FILL,
+            fill: Colors::fill(),
             stroke: Stroke::NONE,
             fill_texture_id: Default::default(),
             uv: Rect::ZERO
@@ -278,7 +278,7 @@ impl Modal {
                 sw: 0.0,
                 se: 0.0,
             },
-            fill: Colors::YELLOW,
+            fill: Colors::yellow(),
             stroke: Stroke::NONE,
             fill_texture_id: Default::default(),
             uv: Rect::ZERO
@@ -288,12 +288,12 @@ impl Modal {
         // Draw title content.
         let title_resp = ui.allocate_ui_at_rect(rect, |ui| {
             ui.vertical_centered_justified(|ui| {
-                ui.add_space(8.0);
+                ui.add_space(10.0);
                 ui.label(RichText::new(self.title.as_ref().unwrap())
                     .size(19.0)
-                    .color(Colors::TITLE)
+                    .color(Colors::title(true))
                 );
-                ui.add_space(8.0);
+                ui.add_space(10.0);
             });
         }).response;
 
@@ -302,6 +302,6 @@ impl Modal {
         ui.painter().set(bg_idx, bg_shape);
 
         // Draw line below title.
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
     }
 }

src/gui/views/network/connections.rs

@@ -101,12 +101,12 @@ impl ConnectionsContent {
 
         // Show external connections.
         ui.add_space(8.0);
-        ui.label(RichText::new(t!("wallets.ext_conn")).size(16.0).color(Colors::GRAY));
+        ui.label(RichText::new(t!("wallets.ext_conn")).size(16.0).color(Colors::gray()));
         ui.add_space(6.0);
 
         // Show button to add new external node connection.
         let add_node_text = format!("{} {}", PLUS_CIRCLE, t!("wallets.add_node"));
-        View::button(ui, add_node_text, Colors::WHITE, || {
+        View::button(ui, add_node_text, Colors::white_or_black(false), || {
             self.show_add_ext_conn_modal(None, cb);
         });
 
@@ -130,7 +130,7 @@ impl ConnectionsContent {
         let mut rect = ui.available_rect_before_wrap();
         rect.set_height(78.0);
         let rounding = View::item_rounding(0, 1, false);
-        ui.painter().rect(rect, rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(rect, rounding, Colors::fill(), View::item_stroke());
 
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
             // Draw button to show integrated node info.
@@ -140,12 +140,12 @@ impl ConnectionsContent {
 
             if !Node::is_running() {
                 // Draw button to start integrated node.
-                View::item_button(ui, Rounding::default(), POWER, Some(Colors::GREEN), || {
+                View::item_button(ui, Rounding::default(), POWER, Some(Colors::green()), || {
                     Node::start();
                 });
             } else if !Node::is_starting() && !Node::is_stopping() && !Node::is_restarting() {
                 // Draw button to stop integrated node.
-                View::item_button(ui, Rounding::default(), POWER, Some(Colors::RED), || {
+                View::item_button(ui, Rounding::default(), POWER, Some(Colors::red()), || {
                     Node::stop(false);
                 });
             }
@@ -157,12 +157,12 @@ impl ConnectionsContent {
                     ui.add_space(3.0);
                     ui.label(RichText::new(t!("network.node"))
                                  .size(18.0)
-                                 .color(Colors::TITLE));
+                                 .color(Colors::title(false)));
 
                     // Setup node API address text.
                     let api_address = NodeConfig::get_api_address();
                     let address_text = format!("{} http://{}", COMPUTER_TOWER, api_address);
-                    ui.label(RichText::new(address_text).size(15.0).color(Colors::TEXT));
+                    ui.label(RichText::new(address_text).size(15.0).color(Colors::text(false)));
                     ui.add_space(1.0);
 
                     // Setup node status text.
@@ -174,7 +174,7 @@ impl ConnectionsContent {
                         DOTS_THREE_CIRCLE
                     };
                     let status_text = format!("{} {}", status_icon, Node::get_sync_status_text());
-                    ui.label(RichText::new(status_text).size(15.0).color(Colors::GRAY));
+                    ui.label(RichText::new(status_text).size(15.0).color(Colors::gray()));
                 })
             });
         });
@@ -194,7 +194,7 @@ impl ConnectionsContent {
         // Draw round background.
         let bg_rect = rect.clone();
         let item_rounding = View::item_rounding(index, len, false);
-        ui.painter().rect(bg_rect, item_rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, item_rounding, Colors::fill(), View::item_stroke());
 
         ui.vertical(|ui| {
             ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -216,7 +216,7 @@ impl ConnectionsContent {
                         // Draw connections URL.
                         ui.add_space(4.0);
                         let conn_text = format!("{} {}", GLOBE_SIMPLE, conn.url);
-                        View::ellipsize_text(ui, conn_text, 15.0, Colors::TITLE);
+                        View::ellipsize_text(ui, conn_text, 15.0, Colors::title(false));
                         ui.add_space(1.0);
 
                         // Setup connection status text.
@@ -229,7 +229,7 @@ impl ConnectionsContent {
                         } else {
                             format!("{} {}", DOTS_THREE_CIRCLE, t!("network.availability_check"))
                         };
-                        ui.label(RichText::new(status_text).size(15.0).color(Colors::GRAY));
+                        ui.label(RichText::new(status_text).size(15.0).color(Colors::gray()));
                         ui.add_space(3.0);
                     });
                 });
@@ -270,7 +270,7 @@ impl ConnectionsContent {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.node_url"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw node URL text edit.
@@ -285,7 +285,7 @@ impl ConnectionsContent {
 
             ui.label(RichText::new(t!("wallets.node_secret"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw node API secret text edit.
@@ -298,7 +298,7 @@ impl ConnectionsContent {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("wallets.invalid_url"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(12.0);
         });
@@ -310,7 +310,7 @@ impl ConnectionsContent {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -352,7 +352,7 @@ impl ConnectionsContent {
                         (on_add)();
                     });
 
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_add);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_add);
                 });
             });
             ui.add_space(6.0);

src/gui/views/network/content.rs

@@ -54,8 +54,8 @@ impl NetworkContent {
         egui::TopBottomPanel::bottom("node_tabs_panel")
             .resizable(false)
             .frame(egui::Frame {
-                fill: Colors::FILL,
-                stroke: View::ITEM_STROKE,
+                fill: Colors::fill(),
+                stroke: View::item_stroke(),
                 inner_margin: Margin {
                     left: View::get_left_inset() + 4.0,
                     right: View::far_right_inset_margin(ui) + 4.0,
@@ -78,14 +78,14 @@ impl NetworkContent {
             .resizable(false)
             .exact_width(ui.available_width())
             .frame(egui::Frame {
-                stroke: View::DEFAULT_STROKE,
+                stroke: View::default_stroke(),
                 ..Default::default()
             })
             .show_animated_inside(ui, !show_connections, |ui| {
                 egui::CentralPanel::default()
                     .frame(egui::Frame {
-                        fill: Colors::WHITE,
-                        stroke: View::DEFAULT_STROKE,
+                        fill: Colors::white_or_black(false),
+                        stroke: View::default_stroke(),
                         inner_margin: Margin {
                             left: View::get_left_inset() + 4.0,
                             right: View::far_right_inset_margin(ui) + 4.0,
@@ -104,7 +104,7 @@ impl NetworkContent {
         egui::CentralPanel::default()
             .frame(egui::Frame {
                 stroke: if show_connections{
-                    View::DEFAULT_STROKE
+                    View::default_stroke()
                 } else {
                     Stroke::NONE
                 },
@@ -122,7 +122,7 @@ impl NetworkContent {
                     top: 3.0,
                     bottom: View::get_bottom_inset() + 4.0,
                 },
-                fill: Colors::BUTTON,
+                fill: Colors::button(),
                 ..Default::default()
             })
             .show_inside(ui, |ui| {
@@ -230,10 +230,10 @@ impl NetworkContent {
             let text = t!("network.disabled_server", "dots" => DOTS_THREE_OUTLINE_VERTICAL);
             ui.label(RichText::new(text)
                 .size(16.0)
-                .color(Colors::INACTIVE_TEXT)
+                .color(Colors::inactive_text())
             );
             ui.add_space(8.0);
-            View::button(ui, format!("{} {}", POWER, t!("network.enable_node")), Colors::GOLD, || {
+            View::action_button(ui, format!("{} {}", POWER, t!("network.enable_node")), || {
                 Node::start();
             });
             ui.add_space(2.0);
@@ -255,7 +255,7 @@ impl NetworkContent {
                     ui.add_space(18.0);
                     ui.label(RichText::new(t)
                         .size(16.0)
-                        .color(Colors::INACTIVE_TEXT)
+                        .color(Colors::inactive_text())
                     );
                 });
             }
@@ -277,13 +277,13 @@ impl NetworkContent {
                 View::center_content(ui, 156.0, |ui| {
                     ui.label(RichText::new(t!("network_node.error_clean"))
                         .size(16.0)
-                        .color(Colors::RED)
+                        .color(Colors::red())
                     );
                     ui.add_space(8.0);
                     let btn_txt = format!("{} {}",
                                           ARROWS_COUNTER_CLOCKWISE,
                                           t!("network_node.resync"));
-                    View::button(ui, btn_txt, Colors::GOLD, || {
+                    View::action_button(ui, btn_txt, || {
                         Node::clean_up_data();
                         Node::start();
                     });
@@ -304,7 +304,7 @@ impl NetworkContent {
                     );
                     ui.label(RichText::new(text)
                         .size(16.0)
-                        .color(Colors::RED)
+                        .color(Colors::red())
                     );
                     ui.add_space(2.0);
                 });
@@ -314,7 +314,7 @@ impl NetworkContent {
                 View::center_content(ui, 106.0, |ui| {
                     ui.label(RichText::new(t!("network_node.error_config", "settings" => FADERS))
                         .size(16.0)
-                        .color(Colors::RED)
+                        .color(Colors::red())
                     );
                     ui.add_space(2.0);
                 });
@@ -323,13 +323,13 @@ impl NetworkContent {
                 View::center_content(ui, 156.0, |ui| {
                     ui.label(RichText::new(t!("network_node.error_unknown", "settings" => FADERS))
                         .size(16.0)
-                        .color(Colors::RED)
+                        .color(Colors::red())
                     );
                     ui.add_space(8.0);
                     let btn_txt = format!("{} {}",
                                           ARROWS_COUNTER_CLOCKWISE,
                                           t!("network_node.resync"));
-                    View::button(ui, btn_txt, Colors::GOLD, || {
+                    View::action_button(ui, btn_txt, || {
                         Node::clean_up_data();
                         Node::start();
                     });

src/gui/views/network/metrics.rs

@@ -173,7 +173,7 @@ fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: Rounding) {
                 // Draw round background.
                 rect.min += vec2(8.0, 0.0);
                 rect.max -= vec2(8.0, 0.0);
-                ui.painter().rect(rect, rounding, Colors::WHITE, View::ITEM_STROKE);
+                ui.painter().rect(rect, rounding, Colors::white_or_black(false), View::item_stroke());
 
                 ui.add_space(2.0);
 
@@ -181,7 +181,7 @@ fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: Rounding) {
                 ui.horizontal(|ui| {
                     ui.add_space(5.0);
                     ui.label(RichText::new(format!("{} {}", HASH, db.block_hash))
-                        .color(Colors::BLACK)
+                        .color(Colors::white_or_black(true))
                         .size(17.0));
                 });
                 // Draw block difficulty and height.
@@ -192,7 +192,7 @@ fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: Rounding) {
                                             db.difficulty,
                                             AT,
                                             db.block_height);
-                    ui.label(RichText::new(diff_text).color(Colors::TITLE).size(16.0));
+                    ui.label(RichText::new(diff_text).color(Colors::title(false)).size(16.0));
                 });
                 // Draw block date.
                 ui.horizontal(|ui| {
@@ -203,7 +203,7 @@ fn block_item_ui(ui: &mut egui::Ui, db: &DiffBlock, rounding: Rounding) {
                                                    db.duration,
                                                    HOURGLASS_LOW,
                                                    block_time))
-                        .color(Colors::GRAY)
+                        .color(Colors::gray())
                         .size(16.0));
                 });
 

src/gui/views/network/mining.rs

@@ -175,7 +175,7 @@ impl NetworkTab for NetworkMining {
         let workers_size = stratum_stats.worker_stats.len();
         if workers_size != 0 && stratum_stats.num_workers > 0 {
             ui.add_space(4.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(4.0);
             ScrollArea::vertical()
                 .id_source("stratum_workers_scroll")
@@ -201,7 +201,7 @@ impl NetworkTab for NetworkMining {
             View::center_content(ui, 142.0, |ui| {
                 ui.label(RichText::new(t!("network_mining.info", "settings" => FADERS))
                     .size(16.0)
-                    .color(Colors::INACTIVE_TEXT)
+                    .color(Colors::inactive_text())
                 );
             });
         }
@@ -218,7 +218,7 @@ fn worker_item_ui(ui: &mut egui::Ui, ws: &WorkerStats, rounding: Rounding) {
             // Draw round background.
             let mut rect = ui.available_rect_before_wrap();
             rect.set_height(WORKER_ITEM_HEIGHT);
-            ui.painter().rect(rect, rounding, Colors::WHITE, View::ITEM_STROKE);
+            ui.painter().rect(rect, rounding, Colors::white_or_black(false), View::item_stroke());
 
             ui.add_space(2.0);
             ui.horizontal(|ui| {
@@ -226,8 +226,12 @@ fn worker_item_ui(ui: &mut egui::Ui, ws: &WorkerStats, rounding: Rounding) {
 
                 // Draw worker connection status.
                 let (status_text, status_icon, status_color) = match ws.is_connected {
-                    true => (t!("network_mining.connected"), PLUGS_CONNECTED, Colors::BLACK),
-                    false => (t!("network_mining.disconnected"), PLUGS, Colors::INACTIVE_TEXT)
+                    true => (
+                        t!("network_mining.connected"),
+                        PLUGS_CONNECTED,
+                        Colors::white_or_black(true)
+                    ),
+                    false => (t!("network_mining.disconnected"), PLUGS, Colors::inactive_text())
                 };
                 let status_line_text = format!("{} {} {}", status_icon, ws.id, status_text);
                 ui.heading(RichText::new(status_line_text)
@@ -241,35 +245,35 @@ fn worker_item_ui(ui: &mut egui::Ui, ws: &WorkerStats, rounding: Rounding) {
                 // Draw difficulty.
                 let diff_text = format!("{} {}", BARBELL, ws.pow_difficulty);
                 ui.heading(RichText::new(diff_text)
-                    .color(Colors::TITLE)
+                    .color(Colors::title(false))
                     .size(16.0));
                 ui.add_space(6.0);
 
                 // Draw accepted shares.
                 let accepted_text = format!("{} {}", FOLDER_SIMPLE_PLUS, ws.num_accepted);
                 ui.heading(RichText::new(accepted_text)
-                    .color(Colors::GREEN)
+                    .color(Colors::green())
                     .size(16.0));
                 ui.add_space(6.0);
 
                 // Draw rejected shares.
                 let rejected_text = format!("{} {}", FOLDER_SIMPLE_MINUS, ws.num_rejected);
                 ui.heading(RichText::new(rejected_text)
-                    .color(Colors::RED)
+                    .color(Colors::red())
                     .size(16.0));
                 ui.add_space(6.0);
 
                 // Draw stale shares.
                 let stale_text = format!("{} {}", FOLDER_DASHED, ws.num_stale);
                 ui.heading(RichText::new(stale_text)
-                    .color(Colors::GRAY)
+                    .color(Colors::gray())
                     .size(16.0));
                 ui.add_space(6.0);
 
                 // Draw blocks found.
                 let blocks_found_text = format!("{} {}", CUBE, ws.num_blocks_found);
                 ui.heading(RichText::new(blocks_found_text)
-                    .color(Colors::TITLE)
+                    .color(Colors::title(false))
                     .size(16.0));
             });
             ui.horizontal(|ui| {
@@ -280,7 +284,7 @@ fn worker_item_ui(ui: &mut egui::Ui, ws: &WorkerStats, rounding: Rounding) {
                 let seen_time = View::format_time(seen_ts as i64);
                 let seen_text = format!("{} {}", CLOCK_AFTERNOON, seen_time);
                 ui.heading(RichText::new(seen_text)
-                    .color(Colors::GRAY)
+                    .color(Colors::gray())
                     .size(16.0));
             });
         });

src/gui/views/network/node.rs

@@ -205,7 +205,7 @@ fn peer_item_ui(ui: &mut egui::Ui, peer: &PeerStats, rounding: Rounding) {
     ui.allocate_ui_at_rect(rect, |ui| {
         ui.vertical(|ui| {
             // Draw round background.
-            ui.painter().rect(rect, rounding, Colors::WHITE, View::ITEM_STROKE);
+            ui.painter().rect(rect, rounding, Colors::white_or_black(false), View::item_stroke());
 
             ui.add_space(2.0);
 
@@ -213,7 +213,7 @@ fn peer_item_ui(ui: &mut egui::Ui, peer: &PeerStats, rounding: Rounding) {
             ui.horizontal(|ui| {
                 ui.add_space(5.0);
                 let addr_text = format!("{} {}", PLUGS_CONNECTED, &peer.addr);
-                ui.label(RichText::new(addr_text).color(Colors::BLACK).size(17.0));
+                ui.label(RichText::new(addr_text).color(Colors::white_or_black(true)).size(17.0));
             });
             // Draw peer difficulty and height
             ui.horizontal(|ui| {
@@ -223,13 +223,13 @@ fn peer_item_ui(ui: &mut egui::Ui, peer: &PeerStats, rounding: Rounding) {
                                         peer.total_difficulty,
                                         AT,
                                         peer.height);
-                ui.label(RichText::new(diff_text).color(Colors::TITLE).size(16.0));
+                ui.label(RichText::new(diff_text).color(Colors::title(false)).size(16.0));
             });
             // Draw peer user-agent
             ui.horizontal(|ui| {
                 ui.add_space(6.0);
                 let agent_text = format!("{} {}", DEVICES, &peer.user_agent);
-                ui.label(RichText::new(agent_text).color(Colors::GRAY).size(16.0));
+                ui.label(RichText::new(agent_text).color(Colors::gray()).size(16.0));
             });
 
             ui.add_space(2.0);

src/gui/views/network/settings.rs

@@ -97,35 +97,35 @@ impl NetworkTab for NetworkSettings {
                         self.node.ui(ui, frame, cb);
 
                         ui.add_space(6.0);
-                        View::horizontal_line(ui, Colors::STROKE);
+                        View::horizontal_line(ui, Colors::stroke());
                         ui.add_space(4.0);
 
                         // Draw P2P server setup section.
                         self.p2p.ui(ui, frame, cb);
 
                         ui.add_space(6.0);
-                        View::horizontal_line(ui, Colors::STROKE);
+                        View::horizontal_line(ui, Colors::stroke());
                         ui.add_space(4.0);
 
                         // Draw Stratum server setup section.
                         self.stratum.ui(ui, frame, cb);
 
                         ui.add_space(6.0);
-                        View::horizontal_line(ui, Colors::STROKE);
+                        View::horizontal_line(ui, Colors::stroke());
                         ui.add_space(4.0);
 
                         // Draw pool setup section.
                         self.pool.ui(ui, frame, cb);
 
                         ui.add_space(6.0);
-                        View::horizontal_line(ui, Colors::STROKE);
+                        View::horizontal_line(ui, Colors::stroke());
                         ui.add_space(4.0);
 
                         // Draw Dandelion server setup section.
                         self.dandelion.ui(ui, frame, cb);
 
                         ui.add_space(6.0);
-                        View::horizontal_line(ui, Colors::STROKE);
+                        View::horizontal_line(ui, Colors::stroke());
                         ui.add_space(6.0);
 
                         // Draw reset settings content.
@@ -143,7 +143,7 @@ impl NetworkSettings {
             ui.add_space(12.0);
             ui.label(RichText::new(t!("network_settings.restart_node_required"))
                 .size(16.0)
-                .color(Colors::GREEN)
+                .color(Colors::green())
             );
         }
     }
@@ -192,7 +192,7 @@ impl NetworkSettings {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network.no_ips"))
                 .size(16.0)
-                .color(Colors::INACTIVE_TEXT)
+                .color(Colors::inactive_text())
             );
             ui.add_space(6.0);
         });
@@ -204,12 +204,12 @@ fn reset_settings_ui(ui: &mut egui::Ui) {
     ui.vertical_centered(|ui| {
         ui.label(RichText::new(t!("network_settings.reset_settings_desc"))
             .size(16.0)
-            .color(Colors::TEXT));
+            .color(Colors::text(false)));
         ui.add_space(8.0);
         let button_text = format!("{} {}",
                                   ARROW_COUNTER_CLOCKWISE,
                                   t!("network_settings.reset_settings"));
-        View::button(ui, button_text, Colors::GOLD, || {
+        View::action_button(ui, button_text, || {
             // Show modal to confirm settings reset.
             Modal::new(RESET_SETTINGS_MODAL)
                 .position(ModalPosition::Center)
@@ -222,7 +222,7 @@ fn reset_settings_ui(ui: &mut egui::Ui) {
             ui.add_space(12.0);
             ui.label(RichText::new(t!("network_settings.restart_node_required"))
                 .size(16.0)
-                .color(Colors::GRAY)
+                .color(Colors::gray())
             );
         }
         ui.add_space(12.0);
@@ -237,24 +237,24 @@ fn reset_settings_confirmation_modal(ui: &mut egui::Ui, modal: &Modal) {
         let reset_text = format!("{}?", t!("network_settings.reset_settings_desc"));
         ui.label(RichText::new(reset_text)
             .size(17.0)
-            .color(Colors::TEXT));
+            .color(Colors::text(false)));
         ui.add_space(8.0);
     });
 
     // Show modal buttons.
     ui.scope(|ui| {
         // Setup spacing between buttons.
-        ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0);
+        ui.spacing_mut().item_spacing = egui::Vec2::new(8.0, 0.0);
 
         ui.columns(2, |columns| {
             columns[0].vertical_centered_justified(|ui| {
-                View::button(ui, t!("network_settings.reset"), Colors::WHITE, || {
+                View::button(ui, t!("network_settings.reset"), Colors::white_or_black(false), || {
                     NodeConfig::reset_to_default();
                     modal.close();
                 });
             });
             columns[1].vertical_centered_justified(|ui| {
-                View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                     modal.close();
                 });
             });

src/gui/views/network/setup/dandelion.rs

@@ -92,7 +92,7 @@ impl DandelionSetup {
         self.current_modal_ui(ui, frame, cb);
 
         View::sub_title(ui, format!("{} {}", GRAPH, "Dandelion"));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
@@ -100,28 +100,28 @@ impl DandelionSetup {
             self.epoch_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show embargo expiration time setup.
             self.embargo_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show aggregation period setup.
             self.aggregation_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show Stem phase probability setup.
             self.stem_prob_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(8.0);
 
             // Show setup to always stem our txs.
@@ -137,12 +137,12 @@ impl DandelionSetup {
     fn epoch_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.epoch_duration"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let epoch = NodeConfig::get_dandelion_epoch();
-        View::button(ui, format!("{} {}", WATCH, epoch.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", WATCH, epoch.clone()), Colors::button(), || {
             // Setup values for modal.
             self.epoch_edit = epoch;
             // Show epoch setup modal.
@@ -161,7 +161,7 @@ impl DandelionSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.epoch_duration"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw epoch text edit.
@@ -173,7 +173,7 @@ impl DandelionSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -196,14 +196,14 @@ impl DandelionSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -214,12 +214,12 @@ impl DandelionSetup {
     fn embargo_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.embargo_timer"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let embargo = NodeConfig::get_dandelion_embargo();
-        View::button(ui, format!("{} {}", TIMER, embargo.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", TIMER, embargo.clone()), Colors::button(), || {
             // Setup values for modal.
             self.embargo_edit = embargo;
             // Show embargo setup modal.
@@ -238,7 +238,7 @@ impl DandelionSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.embargo_timer"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw embargo text edit.
@@ -250,7 +250,7 @@ impl DandelionSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -273,14 +273,14 @@ impl DandelionSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -291,12 +291,12 @@ impl DandelionSetup {
     fn aggregation_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.aggregation_period"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let agg = NodeConfig::get_dandelion_aggregation();
-        View::button(ui, format!("{} {}", CLOCK_COUNTDOWN, agg.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", CLOCK_COUNTDOWN, agg.clone()), Colors::button(), || {
             // Setup values for modal.
             self.aggregation_edit = agg;
             // Show aggregation setup modal.
@@ -315,7 +315,7 @@ impl DandelionSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.aggregation_period"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw aggregation period text edit.
@@ -327,7 +327,7 @@ impl DandelionSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -350,14 +350,14 @@ impl DandelionSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -368,12 +368,12 @@ impl DandelionSetup {
     fn stem_prob_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.stem_probability"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let stem_prob = NodeConfig::get_stem_probability();
-        View::button(ui, format!("{}%", stem_prob.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{}%", stem_prob.clone()), Colors::button(), || {
             // Setup values for modal.
             self.stem_prob_edit = stem_prob;
             // Show stem probability setup modal.
@@ -392,7 +392,7 @@ impl DandelionSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.stem_probability"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw stem phase probability text edit.
@@ -404,7 +404,7 @@ impl DandelionSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -427,14 +427,14 @@ impl DandelionSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);

src/gui/views/network/setup/node.rs

@@ -103,7 +103,7 @@ impl NodeSetup {
         self.current_modal_ui(ui, frame, cb);
 
         View::sub_title(ui, format!("{} {}", COMPUTER_TOWER, t!("network_settings.server")));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
 
         // Show chain type setup.
@@ -126,12 +126,12 @@ impl NodeSetup {
 
                     ui.columns(2, |columns| {
                         columns[0].vertical_centered_justified(|ui| {
-                            View::button(ui, t!("network_settings.disable"), Colors::GOLD, || {
+                            View::action_button(ui, t!("network_settings.disable"), || {
                                 Node::stop(false);
                             });
                         });
                         columns[1].vertical_centered_justified(|ui| {
-                            View::button(ui, t!("network_settings.restart"), Colors::GOLD, || {
+                            View::action_button(ui, t!("network_settings.restart"), || {
                                 Node::restart();
                             });
                         });
@@ -141,7 +141,7 @@ impl NodeSetup {
                 ui.add_space(6.0);
                 ui.vertical_centered(|ui| {
                     let enable_text = format!("{} {}", POWER, t!("network_settings.enable"));
-                    View::button(ui, enable_text, Colors::GOLD, || {
+                    View::action_button(ui, enable_text, || {
                         Node::start();
                     });
                 });
@@ -156,7 +156,7 @@ impl NodeSetup {
                 ui.add_space(2.0);
                 ui.label(RichText::new(t!("network_settings.restart_node_required"))
                     .size(16.0)
-                    .color(Colors::INACTIVE_TEXT)
+                    .color(Colors::inactive_text())
                 );
                 ui.add_space(4.0);
             }
@@ -167,13 +167,13 @@ impl NodeSetup {
             // Show message when IP addresses are not available on the system.
             NetworkSettings::no_ip_address_ui(ui);
         } else {
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("network_settings.api_ip"))
                     .size(16.0)
-                    .color(Colors::GRAY)
+                    .color(Colors::gray())
                 );
                 ui.add_space(6.0);
 
@@ -196,7 +196,7 @@ impl NodeSetup {
         }
 
         ui.add_space(6.0);
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
@@ -204,14 +204,14 @@ impl NodeSetup {
             self.ftl_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Validation setup.
             self.validation_mode_ui(ui);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Archive mode setup.
@@ -222,7 +222,7 @@ impl NodeSetup {
     /// Draw [`ChainTypes`] setup content.
     pub fn chain_type_ui(ui: &mut egui::Ui) {
         ui.vertical_centered(|ui| {
-            ui.label(RichText::new(t!("network.type")).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(t!("network.type")).size(16.0).color(Colors::gray()));
         });
 
         let saved_chain_type = AppConfig::chain_type();
@@ -251,11 +251,11 @@ impl NodeSetup {
 
     /// Draw API port setup content.
     fn api_port_setup_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
-        ui.label(RichText::new(t!("network_settings.api_port")).size(16.0).color(Colors::GRAY));
+        ui.label(RichText::new(t!("network_settings.api_port")).size(16.0).color(Colors::gray()));
         ui.add_space(6.0);
 
         let (_, port) = NodeConfig::get_api_ip_port();
-        View::button(ui, format!("{} {}", PLUG, port.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", PLUG, port.clone()), Colors::button(), || {
             // Setup values for modal.
             self.api_port_edit = port;
             self.api_port_available_edit = self.is_api_port_available;
@@ -273,7 +273,7 @@ impl NodeSetup {
             // Show error when API server port is unavailable.
             ui.label(RichText::new(t!("network_settings.port_unavailable"))
                 .size(16.0)
-                .color(Colors::RED));
+                .color(Colors::red()));
             ui.add_space(6.0);
         }
         ui.add_space(6.0);
@@ -283,7 +283,7 @@ impl NodeSetup {
     fn api_port_modal(&mut self, ui: &mut egui::Ui, modal: &Modal, cb: &dyn PlatformCallbacks) {
         ui.add_space(6.0);
         ui.vertical_centered(|ui| {
-            ui.label(RichText::new(t!("network_settings.api_port")).size(17.0).color(Colors::GRAY));
+            ui.label(RichText::new(t!("network_settings.api_port")).size(17.0).color(Colors::gray()));
             ui.add_space(6.0);
 
             // Draw API port text edit.
@@ -295,7 +295,7 @@ impl NodeSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.port_unavailable"))
                     .size(16.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -330,13 +330,13 @@ impl NodeSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -351,7 +351,7 @@ impl NodeSetup {
         };
         ui.label(RichText::new(secret_title)
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
@@ -366,7 +366,7 @@ impl NodeSetup {
             format!("{} {}", SHIELD_SLASH, t!("network_settings.disabled"))
         };
 
-        View::button(ui, secret_text, Colors::BUTTON, || {
+        View::button(ui, secret_text, Colors::button(), || {
             // Setup values for modal.
             self.secret_edit = secret_value.unwrap_or("".to_string());
             // Show secret edit modal.
@@ -386,7 +386,7 @@ impl NodeSetup {
                 API_SECRET_MODAL => t!("network_settings.api_secret"),
                 _ => t!("network_settings.foreign_api_secret")
             };
-            ui.label(RichText::new(description).size(17.0).color(Colors::GRAY));
+            ui.label(RichText::new(description).size(17.0).color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw API secret token value text edit.
@@ -398,7 +398,7 @@ impl NodeSetup {
             if Node::is_running() {
                 ui.label(RichText::new(t!("network_settings.restart_node_required"))
                     .size(16.0)
-                    .color(Colors::GREEN)
+                    .color(Colors::green())
                 );
                 ui.add_space(6.0);
             }
@@ -427,13 +427,13 @@ impl NodeSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -444,12 +444,12 @@ impl NodeSetup {
     fn ftl_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.ftl"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let ftl = NodeConfig::get_ftl();
-        View::button(ui, format!("{} {}", CLOCK_CLOCKWISE, ftl.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", CLOCK_CLOCKWISE, ftl.clone()), Colors::button(), || {
             // Setup values for modal.
             self.ftl_edit = ftl;
             // Show ftl value setup modal.
@@ -462,7 +462,7 @@ impl NodeSetup {
         ui.add_space(6.0);
         ui.label(RichText::new(t!("network_settings.ftl_description"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT)
+            .color(Colors::inactive_text())
         );
     }
 
@@ -472,7 +472,7 @@ impl NodeSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.ftl"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw ftl value text edit.
@@ -484,7 +484,7 @@ impl NodeSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -507,14 +507,14 @@ impl NodeSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -530,7 +530,7 @@ impl NodeSetup {
         ui.add_space(4.0);
         ui.label(RichText::new(t!("network_settings.full_validation_description"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT)
+            .color(Colors::inactive_text())
         );
     }
 
@@ -543,7 +543,7 @@ impl NodeSetup {
         ui.add_space(4.0);
         ui.label(RichText::new(t!("network_settings.archive_mode_desc"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT)
+            .color(Colors::inactive_text())
         );
     }
 }

src/gui/views/network/setup/p2p.rs

@@ -158,7 +158,7 @@ impl P2PSetup {
         self.current_modal_ui(ui, frame, cb);
 
         View::sub_title(ui, format!("{} {}", HANDSHAKE, t!("network_settings.p2p_server")));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
@@ -166,62 +166,62 @@ impl P2PSetup {
             self.port_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show seeding type setup.
             self.seeding_type_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             ui.label(RichText::new(t!("network_settings.allow_list"))
                 .size(16.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(6.0);
             // Show allowed peers setup.
             self.peer_list_ui(ui, &PeerType::Allowed, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             ui.label(RichText::new(t!("network_settings.deny_list"))
                 .size(16.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(6.0);
             // Show denied peers setup.
             self.peer_list_ui(ui, &PeerType::Denied, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             ui.label(RichText::new(t!("network_settings.favourites"))
                 .size(16.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(6.0);
             // Show preferred peers setup.
             self.peer_list_ui(ui, &PeerType::Preferred, cb);
 
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show ban window setup.
             self.ban_window_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show maximum inbound peers value setup.
             self.max_inbound_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show maximum outbound peers value setup.
@@ -229,7 +229,7 @@ impl P2PSetup {
 
             if !Node::is_restarting() && !self.peers_reset {
                 ui.add_space(6.0);
-                View::horizontal_line(ui, Colors::ITEM_STROKE);
+                View::horizontal_line(ui, Colors::item_stroke());
                 ui.add_space(6.0);
 
                 // Show peers data reset content.
@@ -242,12 +242,12 @@ impl P2PSetup {
     fn port_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.p2p_port"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let port = NodeConfig::get_p2p_port();
-        View::button(ui, format!("{} {}", PLUG, port.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", PLUG, port.clone()), Colors::button(), || {
             // Setup values for modal.
             self.port_edit = port;
             self.port_available_edit = self.is_port_available;
@@ -265,7 +265,7 @@ impl P2PSetup {
             ui.add_space(6.0);
             ui.label(RichText::new(t!("network_settings.port_unavailable"))
                 .size(16.0)
-                .color(Colors::RED));
+                .color(Colors::red()));
             ui.add_space(12.0);
         }
     }
@@ -276,7 +276,7 @@ impl P2PSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.p2p_port"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw p2p port text edit.
@@ -288,7 +288,7 @@ impl P2PSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.port_unavailable"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
 
             ui.add_space(12.0);
@@ -320,14 +320,14 @@ impl P2PSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -370,7 +370,7 @@ impl P2PSetup {
                 };
                 ui.label(RichText::new(desc)
                     .size(16.0)
-                    .color(Colors::INACTIVE_TEXT));
+                    .color(Colors::inactive_text()));
                 ui.add_space(12.0);
             }
 
@@ -380,7 +380,7 @@ impl P2PSetup {
                 format!("{} {}", PLUS_CIRCLE, t!("network_settings.add_peer"))
 
             };
-            View::button(ui, add_text, Colors::BUTTON, || {
+            View::button(ui, add_text, Colors::button(), || {
                 // Setup values for modal.
                 self.is_correct_address_edit = true;
                 self.peer_edit = "".to_string();
@@ -417,7 +417,7 @@ impl P2PSetup {
                 CUSTOM_SEED_MODAL => t!("network_settings.seed_address"),
                 &_ => t!("network_settings.peer_address")
             };
-            ui.label(RichText::new(label_text).size(17.0).color(Colors::GRAY));
+            ui.label(RichText::new(label_text).size(17.0).color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw peer address text edit.
@@ -429,7 +429,7 @@ impl P2PSetup {
                 ui.add_space(10.0);
                 ui.label(RichText::new(t!("network_settings.peer_address_error"))
                     .size(16.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(12.0);
 
@@ -463,14 +463,14 @@ impl P2PSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -481,7 +481,7 @@ impl P2PSetup {
     /// Draw seeding type setup content.
     fn seeding_type_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         let title = Self::DNS_SEEDS_TITLE;
-        ui.label(RichText::new(title).size(16.0).color(Colors::GRAY));
+        ui.label(RichText::new(title).size(16.0).color(Colors::gray()));
         ui.add_space(2.0);
 
         let default_seeding = NodeConfig::is_default_seeding_type();
@@ -502,12 +502,12 @@ impl P2PSetup {
     fn ban_window_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.ban_window"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let ban_window = NodeConfig::get_p2p_ban_window();
-        View::button(ui, format!("{} {}", PROHIBIT_INSET, ban_window.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", PROHIBIT_INSET, ban_window.clone()), Colors::button(), || {
             // Setup values for modal.
             self.ban_window_edit = ban_window;
             // Show ban window period setup modal.
@@ -520,7 +520,7 @@ impl P2PSetup {
         ui.add_space(6.0);
         ui.label(RichText::new(t!("network_settings.ban_window_desc"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT)
+            .color(Colors::inactive_text())
         );
         ui.add_space(2.0);
     }
@@ -531,7 +531,7 @@ impl P2PSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.ban_window"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw ban window text edit.
@@ -543,7 +543,7 @@ impl P2PSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -566,14 +566,14 @@ impl P2PSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -584,13 +584,13 @@ impl P2PSetup {
     fn max_inbound_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.max_inbound_count"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let max_inbound = NodeConfig::get_max_inbound_peers();
         let button_text = format!("{} {}", ARROW_FAT_LINES_DOWN, max_inbound.clone());
-        View::button(ui, button_text, Colors::BUTTON, || {
+        View::button(ui, button_text, Colors::button(), || {
             // Setup values for modal.
             self.max_inbound_count = max_inbound;
             // Show maximum number of inbound peers setup modal.
@@ -609,7 +609,7 @@ impl P2PSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.max_inbound_count"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw maximum number of inbound peers text edit.
@@ -621,7 +621,7 @@ impl P2PSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -644,14 +644,14 @@ impl P2PSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -662,13 +662,13 @@ impl P2PSetup {
     fn max_outbound_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.max_outbound_count"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let max_outbound = NodeConfig::get_max_outbound_peers();
         let button_text = format!("{} {}", ARROW_FAT_LINES_UP, max_outbound.clone());
-        View::button(ui, button_text, Colors::BUTTON, || {
+        View::button(ui, button_text, Colors::button(), || {
             // Setup values for modal.
             self.max_outbound_count = max_outbound;
             // Show maximum number of outbound peers setup modal.
@@ -687,7 +687,7 @@ impl P2PSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.max_outbound_count"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw maximum number of outbound peers text edit.
@@ -699,7 +699,7 @@ impl P2PSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -722,14 +722,14 @@ impl P2PSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -741,14 +741,14 @@ impl P2PSetup {
         ui.add_space(4.0);
 
         let button_text = format!("{} {}", TRASH, t!("network_settings.reset_peers"));
-        View::colored_text_button(ui, button_text, Colors::RED, Colors::BUTTON, || {
+        View::colored_text_button(ui, button_text, Colors::red(), Colors::button(), || {
             Node::reset_peers(false);
             self.peers_reset = true;
         });
         ui.add_space(6.0);
         ui.label(RichText::new(t!("network_settings.reset_peers_desc"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT)
+            .color(Colors::inactive_text())
         );
     }
 }
@@ -767,7 +767,7 @@ fn peer_item_ui(ui: &mut egui::Ui,
     let mut bg_rect = rect.clone();
     bg_rect.min += egui::emath::vec2(6.0, 0.0);
     let item_rounding = View::item_rounding(index, len, false);
-    ui.painter().rect(bg_rect, item_rounding, Colors::WHITE, View::ITEM_STROKE);
+    ui.painter().rect(bg_rect, item_rounding, Colors::white_or_black(false), View::item_stroke());
 
     ui.vertical(|ui| {
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -798,7 +798,7 @@ fn peer_item_ui(ui: &mut egui::Ui,
                 // Draw peer address.
                 let peer_text = format!("{} {}", GLOBE_SIMPLE, &peer_addr);
                 ui.label(RichText::new(peer_text)
-                    .color(Colors::TEXT_BUTTON)
+                    .color(Colors::text_button())
                     .size(16.0));
             });
         });

src/gui/views/network/setup/pool.rs

@@ -100,7 +100,7 @@ impl PoolSetup {
         self.current_modal_ui(ui, frame, cb);
 
         View::sub_title(ui, format!("{} {}", CHART_SCATTER, t!("network_settings.tx_pool")));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
@@ -108,28 +108,28 @@ impl PoolSetup {
             self.fee_base_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show reorg cache retention period setup.
             self.reorg_period_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show pool size setup.
             self.pool_size_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show stem pool size setup.
             self.stem_size_ui(ui, cb);
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show max weight of transactions setup.
@@ -141,12 +141,12 @@ impl PoolSetup {
     fn fee_base_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.pool_fee"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let fee = NodeConfig::get_base_fee();
-        View::button(ui, format!("{} {}", HAND_COINS, fee.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", HAND_COINS, fee.clone()), Colors::button(), || {
             // Setup values for modal.
             self.fee_base_edit = fee;
             // Show fee setup modal.
@@ -165,7 +165,7 @@ impl PoolSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.pool_fee"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw fee base text edit.
@@ -177,7 +177,7 @@ impl PoolSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -199,14 +199,14 @@ impl PoolSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -218,12 +218,12 @@ impl PoolSetup {
     fn reorg_period_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.reorg_period"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let period = NodeConfig::get_reorg_cache_period();
-        View::button(ui, format!("{} {}", CLOCK_COUNTDOWN, period.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", CLOCK_COUNTDOWN, period.clone()), Colors::button(), || {
             // Setup values for modal.
             self.reorg_period_edit = period;
             // Show reorg period setup modal.
@@ -242,7 +242,7 @@ impl PoolSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.reorg_period"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw reorg period text edit.
@@ -254,7 +254,7 @@ impl PoolSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -276,14 +276,14 @@ impl PoolSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -295,12 +295,12 @@ impl PoolSetup {
     fn pool_size_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.max_tx_pool"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let size = NodeConfig::get_max_pool_size();
-        View::button(ui, format!("{} {}", CIRCLES_THREE, size.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", CIRCLES_THREE, size.clone()), Colors::button(), || {
             // Setup values for modal.
             self.pool_size_edit = size;
             // Show pool size setup modal.
@@ -319,7 +319,7 @@ impl PoolSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.max_tx_pool"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw pool size text edit.
@@ -331,7 +331,7 @@ impl PoolSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -353,14 +353,14 @@ impl PoolSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -372,12 +372,12 @@ impl PoolSetup {
     fn stem_size_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.max_tx_stempool"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let size = NodeConfig::get_max_stempool_size();
-        View::button(ui, format!("{} {}", BEZIER_CURVE, size.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", BEZIER_CURVE, size.clone()), Colors::button(), || {
             // Setup values for modal.
             self.stempool_size_edit = size;
             // Show stempool size setup modal.
@@ -396,7 +396,7 @@ impl PoolSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.max_tx_stempool"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw stempool size text edit.
@@ -408,7 +408,7 @@ impl PoolSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -430,14 +430,14 @@ impl PoolSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -449,12 +449,12 @@ impl PoolSetup {
     fn max_weight_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.max_tx_weight"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let weight = NodeConfig::get_mineable_max_weight();
-        View::button(ui, format!("{} {}", BOUNDING_BOX, weight.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", BOUNDING_BOX, weight.clone()), Colors::button(), || {
             // Setup values for modal.
             self.max_weight_edit = weight;
             // Show total tx weight setup modal.
@@ -473,7 +473,7 @@ impl PoolSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.max_tx_weight"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw tx weight text edit.
@@ -485,7 +485,7 @@ impl PoolSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 NetworkSettings::node_restart_required_ui(ui);
             }
@@ -507,14 +507,14 @@ impl PoolSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);

src/gui/views/network/setup/stratum.rs

@@ -97,7 +97,7 @@ impl StratumSetup {
         self.current_modal_ui(ui, frame, cb);
 
         View::sub_title(ui, format!("{} {}", HARD_DRIVES, t!("network_mining.server")));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
@@ -112,14 +112,14 @@ impl StratumSetup {
                 } else if Node::get_stratum_stats().is_running {
                     ui.add_space(6.0);
                     let disable_text = format!("{} {}", POWER, t!("network_settings.disable"));
-                    View::button(ui, disable_text, Colors::GOLD, || {
+                    View::action_button(ui, disable_text, || {
                         Node::stop_stratum();
                     });
                     ui.add_space(6.0);
                 } else {
                     ui.add_space(6.0);
                     let enable_text = format!("{} {}", POWER, t!("network_settings.enable"));
-                    View::button(ui, enable_text, Colors::GOLD, || {
+                    View::action_button(ui, enable_text, || {
                         Node::start_stratum();
                     });
                     ui.add_space(6.0);
@@ -137,13 +137,13 @@ impl StratumSetup {
                 ui.add_space(2.0);
                 ui.label(RichText::new(t!("network_mining.restart_server_required"))
                     .size(16.0)
-                    .color(Colors::INACTIVE_TEXT)
+                    .color(Colors::inactive_text())
                 );
             }
             ui.add_space(8.0);
         });
 
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(6.0);
 
         // Show message when IP addresses are not available on the system.
@@ -155,7 +155,7 @@ impl StratumSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.stratum_ip"))
                 .size(16.0)
-                .color(Colors::GRAY)
+                .color(Colors::gray())
             );
             ui.add_space(6.0);
             // Show stratum IP addresses to select.
@@ -168,13 +168,13 @@ impl StratumSetup {
             // Show stratum port setup.
             self.port_setup_ui(ui, cb);
 
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show attempt time setup.
             self.attempt_time_ui(ui, cb);
 
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show minimum acceptable share difficulty setup.
@@ -186,12 +186,12 @@ impl StratumSetup {
     fn port_setup_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.stratum_port"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let (_, port) = NodeConfig::get_stratum_address();
-        View::button(ui, format!("{} {}", PLUG, port.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", PLUG, port.clone()), Colors::button(), || {
             // Setup values for modal.
             self.stratum_port_edit = port;
             self.stratum_port_available_edit = self.is_port_available;
@@ -209,7 +209,7 @@ impl StratumSetup {
             ui.add_space(6.0);
             ui.label(RichText::new(t!("network_settings.port_unavailable"))
                 .size(16.0)
-                .color(Colors::RED));
+                .color(Colors::red()));
             ui.add_space(12.0);
         }
     }
@@ -220,7 +220,7 @@ impl StratumSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.stratum_port"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw stratum port text edit.
@@ -232,7 +232,7 @@ impl StratumSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.port_unavailable"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 server_restart_required_ui(ui);
             }
@@ -266,14 +266,14 @@ impl StratumSetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             // Close modal.
                             cb.hide_keyboard();
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                        View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                     });
                 });
                 ui.add_space(6.0);
@@ -285,12 +285,12 @@ impl StratumSetup {
     fn attempt_time_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.attempt_time"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let time = NodeConfig::get_stratum_attempt_time();
-        View::button(ui, format!("{} {}", TIMER, time.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", TIMER, time.clone()), Colors::button(), || {
             // Setup values for modal.
             self.attempt_time_edit = time;
 
@@ -304,7 +304,7 @@ impl StratumSetup {
         ui.add_space(6.0);
         ui.label(RichText::new(t!("network_settings.attempt_time_desc"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT)
+            .color(Colors::inactive_text())
         );
         ui.add_space(6.0);
     }
@@ -315,7 +315,7 @@ impl StratumSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.attempt_time"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw attempt time text edit.
@@ -327,7 +327,7 @@ impl StratumSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 server_restart_required_ui(ui);
             }
@@ -350,14 +350,14 @@ impl StratumSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -368,12 +368,12 @@ impl StratumSetup {
     fn min_diff_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("network_settings.min_share_diff"))
             .size(16.0)
-            .color(Colors::GRAY)
+            .color(Colors::gray())
         );
         ui.add_space(6.0);
 
         let diff = NodeConfig::get_stratum_min_share_diff();
-        View::button(ui, format!("{} {}", BARBELL, diff.clone()), Colors::BUTTON, || {
+        View::button(ui, format!("{} {}", BARBELL, diff.clone()), Colors::button(), || {
             // Setup values for modal.
             self.min_share_diff_edit = diff;
 
@@ -393,7 +393,7 @@ impl StratumSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network_settings.min_share_diff"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw share difficulty text edit.
@@ -405,7 +405,7 @@ impl StratumSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else {
                 server_restart_required_ui(ui);
             }
@@ -428,14 +428,14 @@ impl StratumSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -449,7 +449,7 @@ pub fn server_restart_required_ui(ui: &mut egui::Ui) {
         ui.add_space(12.0);
         ui.label(RichText::new(t!("network_mining.restart_server_required"))
             .size(16.0)
-            .color(Colors::GREEN)
+            .color(Colors::green())
         );
     }
 }

src/gui/views/qr.rs

@@ -131,8 +131,8 @@ impl QrCodeContent {
                 };
                 if !sharing {
                     // Show button to share QR.
-                    let share_text = format!("{} {}", IMAGES_SQUARE, t!("share"));
-                    View::button(ui, share_text, Colors::GOLD, || {
+                    let share_txt = format!("{} {}", IMAGES_SQUARE, t!("share"));
+                    View::action_button(ui, share_txt, || {
                         {
                             let mut w_state = self.qr_image_state.write();
                             w_state.exporting = true;
@@ -211,13 +211,13 @@ impl QrCodeContent {
             ui.add_space(6.0);
 
             // Show QR code text.
-            View::ellipsize_text(ui, text.clone(), 16.0, Colors::INACTIVE_TEXT);
+            View::ellipsize_text(ui, text.clone(), 16.0, Colors::inactive_text());
             ui.add_space(6.0);
 
             // Show button to share QR.
             ui.vertical_centered(|ui| {
                 let share_text = format!("{} {}", IMAGES_SQUARE, t!("share"));
-                View::button(ui, share_text, Colors::GOLD, || {
+                View::action_button(ui, share_text, || {
                     if let Ok(qr) = QrCode::encode_text(text.as_str(), qrcodegen::QrCodeEcc::Low) {
                         if let Some(data) = Self::qr_to_image_data(qr, DEFAULT_QR_SIZE as usize) {
                             let mut png = vec![];

src/gui/views/root.rs

@@ -110,7 +110,7 @@ impl Root {
             .resizable(false)
             .exact_width(panel_width)
             .frame(egui::Frame {
-                fill: Colors::WHITE,
+                fill: Colors::white_or_black(false),
                 ..Default::default()
             })
             .show_animated_inside(ui, is_panel_open, |ui| {
@@ -126,7 +126,7 @@ impl Root {
         // Show wallets content.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                fill: Colors::FILL_DARK,
+                fill: Colors::fill_deep(),
                 ..Default::default()
             })
             .show_inside(ui, |ui| {
@@ -208,7 +208,7 @@ impl Root {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("sync_status.shutdown"))
                     .size(17.0)
-                    .color(Colors::TEXT));
+                    .color(Colors::text(false)));
             });
             ui.add_space(10.0);
         } else {
@@ -216,38 +216,35 @@ impl Root {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("modal_exit.description"))
                     .size(17.0)
-                    .color(Colors::TEXT));
+                    .color(Colors::text(false)));
             });
             ui.add_space(10.0);
 
-            // Show modal buttons.
-            ui.scope(|ui| {
-                // Setup spacing between buttons.
-                ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0);
+            // Setup spacing between buttons.
+            ui.spacing_mut().item_spacing = egui::Vec2::new(6.0, 0.0);
 
-                ui.columns(2, |columns| {
-                    columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
-                            modal.close();
-                        });
-                    });
-                    columns[1].vertical_centered_justified(|ui| {
-                        View::button_ui(ui, t!("modal_exit.exit"), Colors::WHITE, |ui| {
-                            if !Node::is_running() {
-                                self.exit_allowed = true;
-                                ui.ctx().send_viewport_cmd(egui::ViewportCommand::Close);
-                                modal.close();
-                            } else {
-                                Node::stop(true);
-                                modal.disable_closing();
-                                Modal::set_title(t!("modal_exit.exit"));
-                                self.show_exit_progress = true;
-                            }
-                        });
+            ui.columns(2, |columns| {
+                columns[0].vertical_centered_justified(|ui| {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
+                        modal.close();
+                    });
+                });
+                columns[1].vertical_centered_justified(|ui| {
+                    View::button_ui(ui, t!("modal_exit.exit"), Colors::white_or_black(false), |ui| {
+                        if !Node::is_running() {
+                            self.exit_allowed = true;
+                            ui.ctx().send_viewport_cmd(egui::ViewportCommand::Close);
+                            modal.close();
+                        } else {
+                            Node::stop(true);
+                            modal.disable_closing();
+                            Modal::set_title(t!("modal_exit.exit"));
+                            self.show_exit_progress = true;
+                        }
                     });
                 });
-                ui.add_space(6.0);
             });
+            ui.add_space(6.0);
         }
     }
 
@@ -268,16 +265,23 @@ impl Root {
         NodeSetup::chain_type_ui(ui);
 
         ui.add_space(8.0);
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
+        ui.add_space(8.0);
+
+        // Draw theme selection.
+        Self::theme_selection_ui(ui);
+
+        ui.add_space(8.0);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(format!("{}:", t!("language")))
                 .size(16.0)
-                .color(Colors::GRAY)
+                .color(Colors::gray())
             );
         });
-        ui.add_space(6.0);
+        ui.add_space(8.0);
 
         // Draw available list of languages to select.
         let locales = rust_i18n::available_locales!();
@@ -289,13 +293,39 @@ impl Root {
 
         // Show button to close modal.
         ui.vertical_centered_justified(|ui| {
-            View::button(ui, t!("close"), Colors::WHITE, || {
+            View::button(ui, t!("close"), Colors::white_or_black(false), || {
                 modal.close();
             });
         });
         ui.add_space(6.0);
     }
 
+    /// Draw theme selection content.
+    fn theme_selection_ui(ui: &mut egui::Ui) {
+        ui.vertical_centered(|ui| {
+            ui.label(RichText::new(t!("theme")).size(16.0).color(Colors::gray()));
+        });
+
+        let saved_use_dark = AppConfig::dark_theme().unwrap_or(false);
+        let mut selected_use_dark = saved_use_dark;
+
+        ui.add_space(8.0);
+        ui.columns(2, |columns| {
+            columns[0].vertical_centered(|ui| {
+                View::radio_value(ui, &mut selected_use_dark, false, t!("light"));
+            });
+            columns[1].vertical_centered(|ui| {
+                View::radio_value(ui, &mut selected_use_dark, true, t!("dark"));
+            })
+        });
+        ui.add_space(8.0);
+
+        if saved_use_dark != selected_use_dark {
+            AppConfig::set_dark_theme(selected_use_dark);
+            crate::setup_visuals(ui.ctx());
+        }
+    }
+
     /// Draw language selection item content.
     fn language_item_ui(locale: &str, ui: &mut egui::Ui, index: usize, len: usize, modal: &Modal) {
         // Setup layout size.
@@ -305,7 +335,7 @@ impl Root {
         // Draw round background.
         let bg_rect = rect.clone();
         let item_rounding = View::item_rounding(index, len, false);
-        ui.painter().rect(bg_rect, item_rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, item_rounding, Colors::fill(), View::item_stroke());
 
         ui.vertical(|ui| {
             ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -323,7 +353,7 @@ impl Root {
                     });
                 } else {
                     ui.add_space(14.0);
-                    ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::GREEN));
+                    ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::green()));
                     ui.add_space(14.0);
                 }
 
@@ -333,9 +363,14 @@ impl Root {
                     ui.vertical(|ui| {
                         // Draw language name.
                         ui.add_space(12.0);
+                        let color = if is_current {
+                            Colors::title(false)
+                        } else {
+                            Colors::gray()
+                        };
                         ui.label(RichText::new(t!("lang_name", locale = locale))
                             .size(17.0)
-                            .color(Colors::TEXT));
+                            .color(color));
                         ui.add_space(3.0);
                     });
                 });
@@ -349,11 +384,11 @@ impl Root {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("network.android_warning"))
                 .size(15.0)
-                .color(Colors::TEXT));
+                .color(Colors::text(false)));
         });
         ui.add_space(8.0);
         ui.vertical_centered_justified(|ui| {
-            View::button(ui, t!("continue"), Colors::WHITE, || {
+            View::button(ui, t!("continue"), Colors::white_or_black(false), || {
                 AppConfig::show_android_integrated_node_warning();
                 modal.close();
             });

src/gui/views/title_panel.rs

@@ -59,7 +59,7 @@ impl TitlePanel {
             .exact_height(Self::DEFAULT_HEIGHT)
             .frame(egui::Frame {
                 inner_margin: Self::inner_margin(ui),
-                fill: Colors::YELLOW,
+                fill: Colors::yellow(),
                 ..Default::default()
             })
             .show_inside(ui, |ui| {
@@ -118,7 +118,7 @@ impl TitlePanel {
                 strip.cell(|ui| {
                     ui.add_space(2.0);
                     ui.centered_and_justified(|ui| {
-                        View::ellipsize_text(ui, text, 19.0, Colors::TITLE);
+                        View::ellipsize_text(ui, text, 19.0, Colors::title(true));
                     });
                 });
             }
@@ -149,12 +149,12 @@ impl TitlePanel {
                 strip.cell(|ui| {
                     ui.add_space(4.0);
                     ui.centered_and_justified(|ui| {
-                        View::ellipsize_text(ui, title, 18.0, Colors::TITLE);
+                        View::ellipsize_text(ui, title, 18.0, Colors::title(true));
                     });
                 });
                 strip.cell(|ui| {
                     ui.centered_and_justified(|ui| {
-                        View::animate_text(ui, subtitle, 15.0, Colors::TEXT, animate_sub);
+                        View::animate_text(ui, subtitle, 15.0, Colors::text(true), animate_sub);
                     });
                 });
             });

src/gui/views/views.rs

@@ -33,12 +33,20 @@ use crate::gui::views::types::TextEditOptions;
 pub struct View;
 
 impl View {
-    /// Default stroke around views.
-    pub const DEFAULT_STROKE: Stroke = Stroke { width: 1.0, color: Colors::STROKE };
-    /// Stroke for items.
-    pub const ITEM_STROKE: Stroke = Stroke { width: 1.0, color: Colors::ITEM_STROKE };
-    /// Stroke for hovered items and buttons.
-    pub const HOVER_STROKE: Stroke = Stroke { width: 1.0, color: Colors::ITEM_HOVER };
+    /// Get default stroke around views.
+    pub fn default_stroke() -> Stroke {
+        Stroke { width: 1.0, color: Colors::stroke() }
+    }
+
+    /// Get default stroke around item buttons.
+    pub fn item_stroke() -> Stroke {
+        Stroke { width: 1.0, color: Colors::item_stroke() }
+    }
+
+    /// Get stroke for hovered items and buttons.
+    pub fn hover_stroke() -> Stroke {
+        Stroke { width: 1.0, color: Colors::item_hover() }
+    }
 
     /// Draw content with maximum width value.
     pub fn max_width_ui(ui: &mut egui::Ui,
@@ -149,7 +157,7 @@ impl View {
     /// Draw horizontally centered sub-title with space below.
     pub fn sub_title(ui: &mut egui::Ui, text: String) {
         ui.vertical_centered_justified(|ui| {
-            ui.label(RichText::new(text.to_uppercase()).size(16.0).color(Colors::TEXT));
+            ui.label(RichText::new(text.to_uppercase()).size(16.0).color(Colors::text(false)));
         });
         ui.add_space(4.0);
     }
@@ -170,20 +178,15 @@ impl View {
     /// Title button with transparent background fill color, contains only icon.
     pub fn title_button(ui: &mut egui::Ui, icon: &str, action: impl FnOnce()) {
         ui.scope(|ui| {
-            // Disable stroke when inactive.
+            // Disable strokes.
             ui.style_mut().visuals.widgets.inactive.bg_stroke = Stroke::NONE;
-            // Setup stroke around title buttons on click.
-            ui.style_mut().visuals.widgets.hovered.bg_stroke = Self::HOVER_STROKE;
-            ui.style_mut().visuals.widgets.active.bg_stroke = Self::DEFAULT_STROKE;
-            // Disable rounding.
-            ui.style_mut().visuals.widgets.hovered.rounding = Rounding::default();
+            ui.style_mut().visuals.widgets.hovered.bg_stroke = Stroke::NONE;
+            ui.style_mut().visuals.widgets.active.bg_stroke = Stroke::NONE;
             ui.style_mut().visuals.widgets.active.rounding = Rounding::default();
-            // Disable expansion.
-            ui.style_mut().visuals.widgets.hovered.expansion = 0.0;
             ui.style_mut().visuals.widgets.active.expansion = 0.0;
 
             // Setup text.
-            let wt = RichText::new(icon.to_string()).size(22.0).color(Colors::TITLE);
+            let wt = RichText::new(icon.to_string()).size(22.0).color(Colors::title(true));
             // Draw button.
             let br = Button::new(wt)
                 .fill(Colors::TRANSPARENT)
@@ -200,8 +203,8 @@ impl View {
     pub fn tab_button(ui: &mut egui::Ui, icon: &str, active: bool, action: impl FnOnce()) {
         ui.scope(|ui| {
             let text_color = match active {
-                true => Colors::TITLE,
-                false => Colors::TEXT
+                true => Colors::title(false),
+                false => Colors::text(false)
             };
 
             let mut button = Button::new(RichText::new(icon).size(22.0).color(text_color));
@@ -211,15 +214,15 @@ impl View {
                 ui.style_mut().visuals.widgets.hovered.expansion = 0.0;
                 ui.style_mut().visuals.widgets.active.expansion = 0.0;
                 // Setup fill colors.
-                ui.visuals_mut().widgets.inactive.weak_bg_fill = Colors::WHITE;
-                ui.visuals_mut().widgets.hovered.weak_bg_fill = Colors::BUTTON;
-                ui.visuals_mut().widgets.active.weak_bg_fill = Colors::FILL;
+                ui.visuals_mut().widgets.inactive.weak_bg_fill = Colors::white_or_black(false);
+                ui.visuals_mut().widgets.hovered.weak_bg_fill = Colors::button();
+                ui.visuals_mut().widgets.active.weak_bg_fill = Colors::fill();
                 // Setup stroke colors.
-                ui.visuals_mut().widgets.inactive.bg_stroke = Self::DEFAULT_STROKE;
-                ui.visuals_mut().widgets.hovered.bg_stroke = Self::HOVER_STROKE;
-                ui.visuals_mut().widgets.active.bg_stroke = Self::ITEM_STROKE;
+                ui.visuals_mut().widgets.inactive.bg_stroke = Self::default_stroke();
+                ui.visuals_mut().widgets.hovered.bg_stroke = Self::hover_stroke();
+                ui.visuals_mut().widgets.active.bg_stroke = Self::item_stroke();
             } else {
-                button = button.fill(Colors::FILL).stroke(Stroke::NONE);
+                button = button.fill(Colors::fill()).stroke(Stroke::NONE);
             }
 
             let br = button.ui(ui).on_hover_cursor(CursorIcon::PointingHand);
@@ -234,7 +237,7 @@ impl View {
     fn button_resp(ui: &mut egui::Ui, text: String, text_color: Color32, bg: Color32) -> Response {
         let button_text = Self::ellipsize(text.to_uppercase(), 17.0, text_color);
         Button::new(button_text)
-            .stroke(Self::DEFAULT_STROKE)
+            .stroke(Self::default_stroke())
             .fill(bg)
             .ui(ui)
             .on_hover_cursor(CursorIcon::PointingHand)
@@ -242,7 +245,7 @@ impl View {
 
     /// Draw [`Button`] with specified background fill color and default text color.
     pub fn button(ui: &mut egui::Ui, text: String, fill: Color32, action: impl FnOnce()) {
-        let br = Self::button_resp(ui, text, Colors::TEXT_BUTTON, fill);
+        let br = Self::button_resp(ui, text, Colors::text_button(), fill);
         if Self::touched(ui, br) {
             (action)();
         }
@@ -260,14 +263,20 @@ impl View {
         }
     }
 
+    /// Draw gold action [`Button`].
+    pub fn action_button(ui: &mut egui::Ui,
+                         text: String, action: impl FnOnce()) {
+        Self::colored_text_button(ui, text, Colors::title(true), Colors::gold(), action);
+    }
+
     /// Draw [`Button`] with specified background fill color and ui at callback.
     pub fn button_ui(ui: &mut egui::Ui,
                      text: String,
                      fill: Color32,
                      action: impl FnOnce(&mut egui::Ui)) {
-        let button_text = Self::ellipsize(text.to_uppercase(), 17.0, Colors::TEXT_BUTTON);
+        let button_text = Self::ellipsize(text.to_uppercase(), 17.0, Colors::text_button());
         let br = Button::new(button_text)
-            .stroke(Self::DEFAULT_STROKE)
+            .stroke(Self::default_stroke())
             .fill(fill)
             .ui(ui)
             .on_hover_cursor(CursorIcon::PointingHand);
@@ -294,16 +303,16 @@ impl View {
             ui.style_mut().visuals.widgets.hovered.expansion = 0.0;
             ui.style_mut().visuals.widgets.active.expansion = 0.0;
             // Setup fill colors.
-            ui.visuals_mut().widgets.inactive.weak_bg_fill = Colors::WHITE;
-            ui.visuals_mut().widgets.hovered.weak_bg_fill = Colors::BUTTON;
-            ui.visuals_mut().widgets.active.weak_bg_fill = Colors::FILL;
+            ui.visuals_mut().widgets.inactive.weak_bg_fill = Colors::white_or_black(false);
+            ui.visuals_mut().widgets.hovered.weak_bg_fill = Colors::button();
+            ui.visuals_mut().widgets.active.weak_bg_fill = Colors::fill();
             // Setup stroke colors.
-            ui.visuals_mut().widgets.inactive.bg_stroke = Self::DEFAULT_STROKE;
-            ui.visuals_mut().widgets.hovered.bg_stroke = Self::HOVER_STROKE;
-            ui.visuals_mut().widgets.active.bg_stroke = Self::ITEM_STROKE;
+            ui.visuals_mut().widgets.inactive.bg_stroke = Self::default_stroke();
+            ui.visuals_mut().widgets.hovered.bg_stroke = Self::hover_stroke();
+            ui.visuals_mut().widgets.active.bg_stroke = Self::item_stroke();
 
             // Setup button text color.
-            let text_color = if let Some(c) = color { c } else { Colors::ITEM_BUTTON };
+            let text_color = if let Some(c) = color { c } else { Colors::item_button() };
 
             // Show button.
             let br = Button::new(RichText::new(text).size(20.0).color(text_color))
@@ -340,7 +349,7 @@ impl View {
                 // Draw button to show/hide current password.
                 let eye_icon = if show_pass { EYE } else { EYE_SLASH };
                 let mut changed = false;
-                View::button(ui, eye_icon.to_string(), Colors::WHITE, || {
+                View::button(ui, eye_icon.to_string(), Colors::white_or_black(false), || {
                     show_pass = !show_pass;
                     changed = true;
                 });
@@ -356,7 +365,7 @@ impl View {
             // Setup copy button.
             if options.copy {
                 let copy_icon = COPY.to_string();
-                View::button(ui, copy_icon, Colors::WHITE, || {
+                View::button(ui, copy_icon, Colors::white_or_black(false), || {
                     cb.copy_string_to_buffer(value.clone());
                 });
                 ui.add_space(8.0);
@@ -365,7 +374,7 @@ impl View {
             // Setup paste button.
             if options.paste {
                 let paste_icon = CLIPBOARD_TEXT.to_string();
-                View::button(ui, paste_icon, Colors::WHITE, || {
+                View::button(ui, paste_icon, Colors::white_or_black(false), || {
                     *value = cb.get_string_from_buffer();
                 });
                 ui.add_space(8.0);
@@ -374,7 +383,7 @@ impl View {
             // Setup scan QR code button.
             if options.scan_qr {
                 let scan_icon = SCAN.to_string();
-                View::button(ui, scan_icon, Colors::WHITE, || {
+                View::button(ui, scan_icon, Colors::white_or_black(false), || {
                     cb.start_camera();
                     options.scan_pressed = true;
                 });
@@ -500,7 +509,7 @@ impl View {
                 se: if r[3] { 8.0 } else { 0.0 },
             },
             fill: Colors::TRANSPARENT,
-            stroke: Self::ITEM_STROKE,
+            stroke: Self::item_stroke(),
             fill_texture_id: Default::default(),
             uv: Rect::ZERO
         };
@@ -518,7 +527,7 @@ impl View {
                     // Draw box value.
                     let mut job = LayoutJob::single_section(value, TextFormat {
                         font_id: FontId::proportional(17.0),
-                        color: Colors::BLACK,
+                        color: Colors::white_or_black(true),
                         ..Default::default()
                     });
                     job.wrap = TextWrapping {
@@ -530,7 +539,7 @@ impl View {
                     ui.label(job);
 
                     // Draw box label.
-                    ui.label(RichText::new(label).color(Colors::GRAY).size(15.0));
+                    ui.label(RichText::new(label).color(Colors::gray()).size(15.0));
                 });
 
                 ui.add_space(2.0);
@@ -560,19 +569,19 @@ impl View {
 
     /// Draw big gold loading spinner.
     pub fn big_loading_spinner(ui: &mut egui::Ui) {
-        Spinner::new().size(Self::BIG_SPINNER_SIZE).color(Colors::GOLD).ui(ui);
+        Spinner::new().size(Self::BIG_SPINNER_SIZE).color(Colors::gold()).ui(ui);
     }
 
     /// Draw small gold loading spinner.
     pub fn small_loading_spinner(ui: &mut egui::Ui) {
-        Spinner::new().size(38.0).color(Colors::GOLD).ui(ui);
+        Spinner::new().size(38.0).color(Colors::gold()).ui(ui);
     }
 
     /// Draw the button that looks like checkbox with callback on check.
     pub fn checkbox(ui: &mut egui::Ui, checked: bool, text: String, callback: impl FnOnce()) {
         let (text_value, color) = match checked {
-            true => (format!("{} {}", CHECK_SQUARE, text), Colors::TEXT_BUTTON),
-            false => (format!("{} {}", SQUARE, text), Colors::CHECKBOX)
+            true => (format!("{} {}", CHECK_SQUARE, text), Colors::text_button()),
+            false => (format!("{} {}", SQUARE, text), Colors::checkbox())
         };
 
         let br = Button::new(RichText::new(text_value).size(17.0).color(color))
@@ -591,7 +600,7 @@ impl View {
     pub fn radio_value<T: PartialEq>(ui: &mut egui::Ui, current: &mut T, value: T, text: String) {
         ui.scope(|ui| {
             // Setup background color.
-            ui.visuals_mut().widgets.inactive.bg_fill = Colors::FILL_DARK;
+            ui.visuals_mut().widgets.inactive.bg_fill = Colors::fill_deep();
             // Draw radio button.
             let mut response = ui.radio(*current == value, text)
                 .on_hover_cursor(CursorIcon::PointingHand);

src/gui/views/wallets/content.rs

@@ -115,12 +115,12 @@ impl WalletsContent {
             .frame(egui::Frame {
                 fill: if empty_list && !create_wallet
                     || (dual_panel && show_wallet && !self.show_wallets_at_dual_panel) {
-                    Colors::FILL_DARK
+                    Colors::fill_deep()
                 } else {
                     if create_wallet {
-                        Colors::WHITE
+                        Colors::white_or_black(true)
                     } else {
-                        Colors::BUTTON
+                        Colors::button()
                     }
                 },
                 ..Default::default()
@@ -175,8 +175,8 @@ impl WalletsContent {
         // Show wallets bottom panel.
         egui::TopBottomPanel::bottom("wallets_bottom_panel")
             .frame(egui::Frame {
-                stroke: View::ITEM_STROKE,
-                fill: Colors::FILL,
+                stroke: View::item_stroke(),
+                fill: Colors::fill(),
                 inner_margin: Margin {
                     left: View::get_left_inset() + 4.0,
                     right: View::far_right_inset_margin(ui) + 4.0,
@@ -202,8 +202,8 @@ impl WalletsContent {
             // Show wallet list panel.
             egui::CentralPanel::default()
                 .frame(egui::Frame {
-                    stroke: View::DEFAULT_STROKE,
-                    fill: Colors::FILL_DARK,
+                    stroke: View::default_stroke(),
+                    fill: Colors::fill_deep(),
                     inner_margin: Margin {
                         left: if list_hidden {
                             0.0
@@ -337,11 +337,6 @@ impl WalletsContent {
                       dual_panel: bool,
                       cb: &dyn PlatformCallbacks) {
         ui.scope(|ui| {
-            // Setup scroll bar color.
-            ui.style_mut().visuals.widgets.inactive.bg_fill = Colors::ITEM_HOVER;
-            ui.style_mut().visuals.widgets.hovered.bg_fill = Colors::STROKE;
-
-            // Draw list of wallets.
             ScrollArea::vertical()
                 .id_source("wallet_list")
                 .scroll_bar_visibility(ScrollBarVisibility::AlwaysHidden)
@@ -389,11 +384,15 @@ impl WalletsContent {
         rect.set_height(78.0);
         let rounding = View::item_rounding(0, 1, false);
         let bg = if current {
-            egui::Color32::from_gray(234)
+            if AppConfig::dark_theme().unwrap_or(false) {
+                egui::Color32::from_gray(32)
+            } else {
+                egui::Color32::from_gray(233)
+            }
         } else {
-            Colors::FILL
+            Colors::fill()
         };
-        ui.painter().rect(rect, rounding, bg, View::HOVER_STROKE);
+        ui.painter().rect(rect, rounding, bg, View::hover_stroke());
 
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
             // Setup padding for item buttons.
@@ -434,7 +433,11 @@ impl WalletsContent {
                 ui.vertical(|ui| {
                     ui.add_space(3.0);
                     // Setup wallet name text.
-                    let name_color = if is_selected { Colors::BLACK } else { Colors::TITLE };
+                    let name_color = if is_selected {
+                        Colors::white_or_black(true)
+                    } else {
+                        Colors::title(false)
+                    };
                     View::ellipsize_text(ui, config.name, 18.0, name_color);
 
                     // Setup wallet connection text.
@@ -443,7 +446,7 @@ impl WalletsContent {
                     } else {
                         format!("{} {}", COMPUTER_TOWER, t!("network.node"))
                     };
-                    View::ellipsize_text(ui, conn_text, 15.0, Colors::TEXT);
+                    View::ellipsize_text(ui, conn_text, 15.0, Colors::text(false));
                     ui.add_space(1.0);
 
                     // Setup wallet status text.
@@ -490,7 +493,7 @@ impl WalletsContent {
                     } else {
                         format!("{} {}", FOLDER_LOCK, t!("wallets.locked"))
                     };
-                    ui.label(RichText::new(status_text).size(15.0).color(Colors::GRAY));
+                    ui.label(RichText::new(status_text).size(15.0).color(Colors::gray()));
                     ui.add_space(4.0);
                 })
             });
@@ -519,7 +522,7 @@ impl WalletsContent {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.pass"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Show password input.
@@ -532,12 +535,12 @@ impl WalletsContent {
                 ui.add_space(10.0);
                 ui.label(RichText::new(t!("wallets.pass_empty"))
                     .size(17.0)
-                    .color(Colors::INACTIVE_TEXT));
+                    .color(Colors::inactive_text()));
             } else if self.wrong_pass {
                 ui.add_space(10.0);
                 ui.label(RichText::new(t!("wallets.wrong_pass"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(12.0);
         });
@@ -549,7 +552,7 @@ impl WalletsContent {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -581,7 +584,7 @@ impl WalletsContent {
                         (on_continue)();
                     });
 
-                    View::button(ui, t!("continue"), Colors::WHITE, on_continue);
+                    View::button(ui, t!("continue"), Colors::white_or_black(false), on_continue);
                 });
             });
             ui.add_space(6.0);

src/gui/views/wallets/creation/creation.rs

@@ -12,11 +12,11 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-use egui::{Id, Margin, RichText, ScrollArea, vec2};
+use egui::{Id, Margin, RichText, ScrollArea, vec2, Widget};
 use egui::scroll_area::ScrollBarVisibility;
 use grin_util::ZeroingString;
 
-use crate::built_info;
+use crate::{AppConfig, built_info};
 use crate::gui::Colors;
 use crate::gui::icons::{CHECK, CLIPBOARD_TEXT, COPY, FOLDER_PLUS, SCAN, SHARE_FAT};
 use crate::gui::platform::PlatformCallbacks;
@@ -74,8 +74,8 @@ impl WalletCreation {
         if self.step.is_some() {
             egui::TopBottomPanel::bottom("wallet_creation_step_panel")
                 .frame(egui::Frame {
-                    stroke: View::DEFAULT_STROKE,
-                    fill: Colors::FILL,
+                    fill: Colors::fill(),
+                    stroke: View::default_stroke(),
                     inner_margin: Margin {
                         left: View::far_left_inset_margin(ui) + 8.0,
                         right: View::get_right_inset() + 8.0,
@@ -99,7 +99,8 @@ impl WalletCreation {
         // Show wallet creation step content panel.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                stroke: View::DEFAULT_STROKE,
+                fill: Colors::fill(),
+                stroke: View::default_stroke(),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,
@@ -168,14 +169,14 @@ impl WalletCreation {
             };
             // Show step description.
             ui.add_space(2.0);
-            ui.label(RichText::new(step_text).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(step_text).size(16.0).color(Colors::gray()));
             ui.add_space(2.0);
             // Show error if entered phrase is not valid.
             if !self.mnemonic_setup.valid_phrase {
                 step_available = false;
                 ui.label(RichText::new(t!("wallets.not_valid_phrase"))
                     .size(16.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
                 ui.add_space(2.0);
             }
             if step == Step::EnterMnemonic {
@@ -197,7 +198,7 @@ impl WalletCreation {
                         } else {
                             // Show QR code scan button.
                             let scan_text = format!("{} {}", SCAN, t!("scan").to_uppercase());
-                            View::button(ui, scan_text, Colors::WHITE, || {
+                            View::button(ui, scan_text, Colors::white_or_black(false), || {
                                 self.mnemonic_setup.show_qr_scan_modal(cb);
                             });
                         }
@@ -221,14 +222,14 @@ impl WalletCreation {
             PhraseMode::Generate => {
                 // Show copy button.
                 let c_t = format!("{} {}", COPY, t!("copy").to_uppercase());
-                View::button(ui, c_t.to_uppercase(), Colors::WHITE, || {
+                View::button(ui, c_t.to_uppercase(), Colors::white_or_black(false), || {
                     cb.copy_string_to_buffer(self.mnemonic_setup.mnemonic.get_phrase());
                 });
             }
             PhraseMode::Import => {
                 // Show paste button.
                 let p_t = format!("{} {}", CLIPBOARD_TEXT, t!("paste").to_uppercase());
-                View::button(ui, p_t, Colors::WHITE, || {
+                View::button(ui, p_t, Colors::white_or_black(false), || {
                     let data = ZeroingString::from(cb.get_string_from_buffer().trim());
                     self.mnemonic_setup.mnemonic.import_text(&data);
                 });
@@ -242,15 +243,15 @@ impl WalletCreation {
                            step: Step,
                            on_create: impl FnOnce(Wallet)) {
         // Setup button text.
-        let (next_text, color) = if step == Step::SetupConnection {
-            (format!("{} {}", CHECK, t!("complete")), Colors::GOLD)
+        let (next_text, text_color, bg_color) = if step == Step::SetupConnection {
+            (format!("{} {}", CHECK, t!("complete")), Colors::title(true), Colors::gold())
         } else {
             let text = format!("{} {}", SHARE_FAT, t!("continue"));
-            (text, Colors::WHITE)
+            (text, Colors::text_button(), Colors::white_or_black(false))
         };
 
         // Show next step button.
-        View::button(ui, next_text.to_uppercase(), color, || {
+        View::colored_text_button(ui, next_text.to_uppercase(), text_color, bg_color, || {
             self.step = if let Some(step) = &self.step {
                 match step {
                     Step::EnterMnemonic => {
@@ -310,28 +311,31 @@ impl WalletCreation {
             None => {
                 // Show wallet creation message if step is empty.
                 View::center_content(ui, 350.0 + View::get_bottom_inset(), |ui| {
-                    ui.add(
-                        egui::Image::new(egui::include_image!("../../../../../img/logo.png"))
-                            .fit_to_exact_size(vec2(180.0, 180.0))
-                    );
+                    let logo = if AppConfig::dark_theme().unwrap_or(false) {
+                        egui::include_image!("../../../../../img/logo_light.png")
+                    } else {
+                        egui::include_image!("../../../../../img/logo.png")
+                    };
+                    // Show app logo.
+                    egui::Image::new(logo).fit_to_exact_size(vec2(180.0, 180.0)).ui(ui);
                     ui.add_space(-15.0);
                     ui.label(RichText::new("GRIM")
                         .size(24.0)
-                        .color(Colors::BLACK)
+                        .color(Colors::white_or_black(true))
                     );
                     ui.label(RichText::new(built_info::PKG_VERSION)
                         .size(16.0)
-                        .color(Colors::BLACK)
+                        .color(Colors::white_or_black(true))
                     );
                     ui.add_space(4.0);
                     let text = t!("wallets.create_desc");
                     ui.label(RichText::new(text)
                         .size(16.0)
-                        .color(Colors::GRAY)
+                        .color(Colors::gray())
                     );
                     ui.add_space(8.0);
                     let add_text = format!("{} {}", FOLDER_PLUS, t!("wallets.add"));
-                    View::button(ui, add_text, Colors::WHITE, || {
+                    View::button(ui, add_text, Colors::white_or_black(false), || {
                         self.show_name_pass_modal(cb);
                     });
                 });
@@ -399,7 +403,7 @@ impl WalletCreation {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.name"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Show wallet name text edit.
@@ -414,7 +418,7 @@ impl WalletCreation {
 
             ui.label(RichText::new(t!("wallets.pass"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw wallet password text edit.
@@ -432,7 +436,7 @@ impl WalletCreation {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -454,7 +458,7 @@ impl WalletCreation {
                         (on_next)();
                     });
 
-                    View::button(ui, t!("continue"), Colors::WHITE, on_next);
+                    View::button(ui, t!("continue"), Colors::white_or_black(false), on_next);
                 });
             });
             ui.add_space(6.0);

src/gui/views/wallets/creation/mnemonic.rs

@@ -100,7 +100,7 @@ impl MnemonicSetup {
         self.mode_type_ui(ui);
 
         ui.add_space(12.0);
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(6.0);
 
         // Show words setup.
@@ -118,7 +118,7 @@ impl MnemonicSetup {
         ui.add_space(4.0);
         ui.vertical_centered(|ui| {
             let text = format!("{}:", t!("wallets.recovery_phrase"));
-            ui.label(RichText::new(text).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(text).size(16.0).color(Colors::gray()));
         });
         ui.add_space(4.0);
         self.word_list_ui(ui, true, cb);
@@ -148,7 +148,7 @@ impl MnemonicSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.words_count"))
                 .size(16.0)
-                .color(Colors::GRAY)
+                .color(Colors::gray())
             );
         });
         ui.add_space(6.0);
@@ -240,7 +240,7 @@ impl MnemonicSetup {
                     cb: &dyn PlatformCallbacks) {
         if edit {
             ui.add_space(6.0);
-            View::button(ui, PENCIL.to_string(), Colors::BUTTON, || {
+            View::button(ui, PENCIL.to_string(), Colors::button(), || {
                 // Setup modal values.
                 self.word_num_edit = num;
                 self.word_edit = word.clone();
@@ -254,11 +254,11 @@ impl MnemonicSetup {
             });
             ui.label(RichText::new(format!("#{} {}", num, word))
                 .size(17.0)
-                .color(Colors::BLACK));
+                .color(Colors::white_or_black(true)));
         } else {
             ui.add_space(12.0);
             let text = format!("#{} {}", num, word);
-            ui.label(RichText::new(text).size(17.0).color(Colors::BLACK));
+            ui.label(RichText::new(text).size(17.0).color(Colors::white_or_black(true)));
         }
     }
 
@@ -273,7 +273,7 @@ impl MnemonicSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.enter_word", "number" => self.word_num_edit))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw word value text edit.
@@ -287,7 +287,7 @@ impl MnemonicSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("wallets.not_valid_word"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(12.0);
         });
@@ -299,7 +299,7 @@ impl MnemonicSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -346,7 +346,7 @@ impl MnemonicSetup {
                         (save)();
                     });
                     // Show save button.
-                    View::button(ui, t!("continue"), Colors::WHITE, save);
+                    View::button(ui, t!("continue"), Colors::white_or_black(false), save);
                 });
             });
             ui.add_space(6.0);
@@ -376,7 +376,7 @@ impl MnemonicSetup {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("wallets.rec_phrase_not_found"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             });
             ui.add_space(6.0);
         } else if let Some(result) = self.camera_content.qr_scan_result() {
@@ -408,13 +408,13 @@ impl MnemonicSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("close"), Colors::WHITE, || {
+                    View::button(ui, t!("close"), Colors::white_or_black(false), || {
                         self.scan_phrase_not_found = None;
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("repeat"), Colors::WHITE, || {
+                    View::button(ui, t!("repeat"), Colors::white_or_black(false), || {
                         Modal::set_title(t!("scan_qr"));
                         self.scan_phrase_not_found = None;
                         cb.start_camera();
@@ -423,7 +423,7 @@ impl MnemonicSetup {
             });
         } else {
             ui.vertical_centered_justified(|ui| {
-                View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                     cb.stop_camera();
                     modal.close();
                 });

src/gui/views/wallets/setup/common.rs

@@ -72,14 +72,18 @@ impl CommonSetup {
             let wallet_name = wallet.get_config().name;
             // Show wallet name.
             ui.add_space(2.0);
-            ui.label(RichText::new(t!("wallets.name")).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(t!("wallets.name"))
+                .size(16.0)
+                .color(Colors::gray()));
             ui.add_space(2.0);
-            ui.label(RichText::new(wallet_name.clone()).size(16.0).color(Colors::BLACK));
+            ui.label(RichText::new(wallet_name.clone())
+                .size(16.0)
+                .color(Colors::white_or_black(true)));
             ui.add_space(8.0);
 
             // Show wallet name setup.
             let name_text = format!("{} {}", PENCIL, t!("change"));
-            View::button(ui, name_text, Colors::BUTTON, || {
+            View::button(ui, name_text, Colors::button(), || {
                 self.name_edit = wallet_name;
                 // Show wallet name modal.
                 Modal::new(NAME_EDIT_MODAL)
@@ -90,14 +94,14 @@ impl CommonSetup {
             });
 
             ui.add_space(12.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
-            ui.label(RichText::new(t!("wallets.pass")).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(t!("wallets.pass")).size(16.0).color(Colors::gray()));
             ui.add_space(6.0);
 
             // Show wallet password setup.
             let pass_text = format!("{} {}", PASSWORD, t!("change"));
-            View::button(ui, pass_text, Colors::BUTTON, || {
+            View::button(ui, pass_text, Colors::button(), || {
                 // Setup modal values.
                 self.first_edit_pass_opening = true;
                 self.old_pass_edit = "".to_string();
@@ -112,15 +116,15 @@ impl CommonSetup {
             });
 
             ui.add_space(12.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
-            ui.label(RichText::new(t!("wallets.min_tx_conf_count")).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(t!("wallets.min_tx_conf_count")).size(16.0).color(Colors::gray()));
             ui.add_space(6.0);
 
             // Show minimum amount of confirmations value setup.
             let min_confirmations = wallet.get_config().min_confirmations;
             let min_conf_text = format!("{} {}", CLOCK_COUNTDOWN, min_confirmations);
-            View::button(ui, min_conf_text, Colors::BUTTON, || {
+            View::button(ui, min_conf_text, Colors::button(), || {
                 self.min_confirmations_edit = min_confirmations.to_string();
                 // Show minimum amount of confirmations value modal.
                 Modal::new(MIN_CONFIRMATIONS_EDIT_MODAL)
@@ -131,7 +135,7 @@ impl CommonSetup {
             });
 
             ui.add_space(12.0);
-            View::horizontal_line(ui, Colors::STROKE);
+            View::horizontal_line(ui, Colors::stroke());
             ui.add_space(4.0);
         });
     }
@@ -176,7 +180,7 @@ impl CommonSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.name"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Show wallet name text edit.
@@ -193,7 +197,7 @@ impl CommonSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -213,7 +217,7 @@ impl CommonSetup {
                         (on_save)();
                     });
 
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);
@@ -232,7 +236,7 @@ impl CommonSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.current_pass"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw old password text edit.
@@ -247,7 +251,7 @@ impl CommonSetup {
 
             ui.label(RichText::new(t!("wallets.new_pass"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw new password text edit.
@@ -262,12 +266,12 @@ impl CommonSetup {
                 ui.add_space(10.0);
                 ui.label(RichText::new(t!("wallets.pass_empty"))
                     .size(17.0)
-                    .color(Colors::INACTIVE_TEXT));
+                    .color(Colors::inactive_text()));
             } else if self.wrong_pass {
                 ui.add_space(10.0);
                 ui.label(RichText::new(t!("wallets.wrong_pass"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(12.0);
         });
@@ -279,7 +283,7 @@ impl CommonSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -311,7 +315,7 @@ impl CommonSetup {
                         (on_continue)();
                     });
 
-                    View::button(ui, t!("change"), Colors::WHITE, on_continue);
+                    View::button(ui, t!("change"), Colors::white_or_black(false), on_continue);
                 });
             });
             ui.add_space(6.0);
@@ -328,7 +332,7 @@ impl CommonSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.min_tx_conf_count"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Minimum amount of confirmations text edit.
@@ -340,7 +344,7 @@ impl CommonSetup {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("network_settings.not_valid_value"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(12.0);
         });
@@ -352,7 +356,7 @@ impl CommonSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -372,7 +376,7 @@ impl CommonSetup {
                         (on_save)();
                     });
 
-                    View::button(ui, t!("modal.save"), Colors::WHITE, on_save);
+                    View::button(ui, t!("modal.save"), Colors::white_or_black(false), on_save);
                 });
             });
             ui.add_space(6.0);

src/gui/views/wallets/setup/connection.rs

@@ -143,7 +143,7 @@ impl ConnectionSetup {
 
         ui.add_space(2.0);
         View::sub_title(ui, format!("{} {}", GLOBE, t!("wallets.conn_method")));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
 
         ui.vertical_centered(|ui| {
@@ -153,12 +153,12 @@ impl ConnectionSetup {
 
             // Show external connections.
             ui.add_space(8.0);
-            ui.label(RichText::new(t!("wallets.ext_conn")).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(t!("wallets.ext_conn")).size(16.0).color(Colors::gray()));
             ui.add_space(6.0);
 
             // Show button to add new external node connection.
             let add_node_text = format!("{} {}", PLUS_CIRCLE, t!("wallets.add_node"));
-            View::button(ui, add_node_text, Colors::WHITE, || {
+            View::button(ui, add_node_text, Colors::white_or_black(false), || {
                 self.show_add_ext_conn_modal(cb);
             });
             ui.add_space(4.0);
@@ -196,7 +196,7 @@ impl ConnectionSetup {
         let mut rect = ui.available_rect_before_wrap();
         rect.set_height(78.0);
         let rounding = View::item_rounding(0, 1, false);
-        ui.painter().rect(rect, rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(rect, rounding, Colors::fill(), View::item_stroke());
 
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
             // Setup padding for item buttons.
@@ -210,13 +210,13 @@ impl ConnectionSetup {
                 });
             } else {
                 ui.add_space(14.0);
-                ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::GREEN));
+                ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::green()));
                 ui.add_space(14.0);
             }
 
             if !Node::is_running() {
                 // Draw button to start integrated node.
-                View::item_button(ui, Rounding::default(), POWER, Some(Colors::GREEN), || {
+                View::item_button(ui, Rounding::default(), POWER, Some(Colors::green()), || {
                     Node::start();
                 });
             }
@@ -228,12 +228,12 @@ impl ConnectionSetup {
                     ui.add_space(3.0);
                     ui.label(RichText::new(t!("network.node"))
                         .size(18.0)
-                        .color(Colors::TITLE));
+                        .color(Colors::title(false)));
 
                     // Setup node API address text.
                     let api_address = NodeConfig::get_api_address();
                     let address_text = format!("{} http://{}", COMPUTER_TOWER, api_address);
-                    ui.label(RichText::new(address_text).size(15.0).color(Colors::TEXT));
+                    ui.label(RichText::new(address_text).size(15.0).color(Colors::text(false)));
                     ui.add_space(1.0);
 
                     // Setup node status text.
@@ -245,7 +245,7 @@ impl ConnectionSetup {
                         DOTS_THREE_CIRCLE
                     };
                     let status_text = format!("{} {}", status_icon, Node::get_sync_status_text());
-                    ui.label(RichText::new(status_text).size(15.0).color(Colors::GRAY));
+                    ui.label(RichText::new(status_text).size(15.0).color(Colors::gray()));
                 })
             });
         });
@@ -265,7 +265,7 @@ impl ConnectionSetup {
         // Draw round background.
         let bg_rect = rect.clone();
         let item_rounding = View::item_rounding(index, len, false);
-        ui.painter().rect(bg_rect, item_rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, item_rounding, Colors::fill(), View::item_stroke());
 
         ui.vertical(|ui| {
             ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -286,7 +286,7 @@ impl ConnectionSetup {
                     });
                 } else {
                     ui.add_space(12.0);
-                    ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::GREEN));
+                    ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::green()));
                 }
 
                 let layout_size = ui.available_size();
@@ -296,7 +296,7 @@ impl ConnectionSetup {
                         // Draw connections URL.
                         ui.add_space(4.0);
                         let conn_text = format!("{} {}", GLOBE_SIMPLE, conn.url);
-                        View::ellipsize_text(ui, conn_text, 15.0, Colors::TITLE);
+                        View::ellipsize_text(ui, conn_text, 15.0, Colors::title(false));
                         ui.add_space(1.0);
                         // Setup connection status text.
                         let status_text = if let Some(available) = conn.available {
@@ -308,7 +308,7 @@ impl ConnectionSetup {
                         } else {
                             format!("{} {}", DOTS_THREE_CIRCLE, t!("network.availability_check"))
                         };
-                        ui.label(RichText::new(status_text).size(15.0).color(Colors::GRAY));
+                        ui.label(RichText::new(status_text).size(15.0).color(Colors::gray()));
                         ui.add_space(3.0);
                     });
                 });
@@ -340,7 +340,7 @@ impl ConnectionSetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.node_url"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw node URL text edit.
@@ -355,7 +355,7 @@ impl ConnectionSetup {
 
             ui.label(RichText::new(t!("wallets.node_secret"))
                 .size(17.0)
-                .color(Colors::GRAY));
+                .color(Colors::gray()));
             ui.add_space(8.0);
 
             // Draw node API secret text edit.
@@ -368,7 +368,7 @@ impl ConnectionSetup {
                 ui.add_space(10.0);
                 ui.label(RichText::new(t!("wallets.invalid_url"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             }
             ui.add_space(10.0);
         });
@@ -380,7 +380,7 @@ impl ConnectionSetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -418,7 +418,7 @@ impl ConnectionSetup {
                         (on_add)();
                     });
 
-                    View::button(ui, t!("modal.add"), Colors::WHITE, on_add);
+                    View::button(ui, t!("modal.add"), Colors::white_or_black(false), on_add);
                 });
             });
             ui.add_space(6.0);

src/gui/views/wallets/setup/recovery.rs

@@ -60,10 +60,10 @@ impl RecoverySetup {
         self.modal_content_ui(ui, wallet, cb);
 
         ui.add_space(10.0);
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(6.0);
         View::sub_title(ui, format!("{} {}", WRENCH, t!("wallets.recovery")));
-        View::horizontal_line(ui, Colors::STROKE);
+        View::horizontal_line(ui, Colors::stroke());
         ui.add_space(4.0);
 
         ui.vertical_centered(|ui| {
@@ -73,60 +73,60 @@ impl RecoverySetup {
                 ui.add_space(6.0);
                 ui.label(RichText::new(t!("wallets.repair_unavailable"))
                     .size(16.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             } else if !wallet.is_repairing() {
                 ui.add_space(6.0);
 
                 // Draw button to repair the wallet.
                 let repair_text = format!("{} {}", STETHOSCOPE, t!("wallets.repair_wallet"));
-                View::button(ui, repair_text, Colors::GOLD, || {
+                View::action_button(ui, repair_text, || {
                     wallet.repair();
                 });
 
                 ui.add_space(6.0);
                 ui.label(RichText::new(t!("wallets.repair_desc"))
                     .size(16.0)
-                    .color(Colors::INACTIVE_TEXT));
+                    .color(Colors::inactive_text()));
             }
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Draw button to restore the wallet.
             let recover_text = format!("{} {}", LIFEBUOY, t!("wallets.recover"));
             ui.add_space(4.0);
-            View::colored_text_button(ui, recover_text, Colors::GREEN, Colors::BUTTON, || {
+            View::colored_text_button(ui, recover_text, Colors::green(), Colors::button(), || {
                 wallet.delete_db(true);
             });
             ui.add_space(6.0);
             ui.label(RichText::new(t!("wallets.restore_wallet_desc"))
                 .size(16.0)
-                .color(Colors::INACTIVE_TEXT));
+                .color(Colors::inactive_text()));
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             let recovery_text = format!("{}:", t!("wallets.recovery_phrase"));
-            ui.label(RichText::new(recovery_text).size(16.0).color(Colors::GRAY));
+            ui.label(RichText::new(recovery_text).size(16.0).color(Colors::gray()));
             ui.add_space(6.0);
 
             // Draw button to show recovery phrase.
             let show_text = format!("{} {}", EYE, t!("show"));
-            View::button(ui, show_text, Colors::BUTTON, || {
+            View::button(ui, show_text, Colors::button(), || {
                 self.show_recovery_phrase_modal(cb);
             });
 
             ui.add_space(12.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
-            ui.label(RichText::new(t!("wallets.delete_desc")).size(16.0).color(Colors::RED));
+            ui.label(RichText::new(t!("wallets.delete_desc")).size(16.0).color(Colors::red()));
             ui.add_space(6.0);
 
             // Draw button to delete the wallet.
             let delete_text = format!("{} {}", TRASH, t!("wallets.delete"));
-            View::colored_text_button(ui, delete_text, Colors::RED, Colors::BUTTON, || {
+            View::colored_text_button(ui, delete_text, Colors::red(), Colors::button(), || {
                 Modal::new(DELETE_CONFIRMATION_MODAL)
                     .position(ModalPosition::Center)
                     .title(t!("modal.confirmation"))
@@ -186,11 +186,11 @@ impl RecoverySetup {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(self.recovery_phrase.clone().unwrap().to_string())
                     .size(17.0)
-                    .color(Colors::BLACK));
+                    .color(Colors::white_or_black(true)));
             });
             ui.add_space(10.0);
             ui.vertical_centered_justified(|ui| {
-                View::button(ui, t!("close"), Colors::WHITE, || {
+                View::button(ui, t!("close"), Colors::white_or_black(false), || {
                     self.recovery_phrase = None;
                     modal.close();
                 });
@@ -199,7 +199,7 @@ impl RecoverySetup {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("wallets.pass"))
                     .size(17.0)
-                    .color(Colors::GRAY));
+                    .color(Colors::gray()));
                 ui.add_space(8.0);
 
                 // Draw current wallet password text edit.
@@ -212,12 +212,12 @@ impl RecoverySetup {
                     ui.add_space(12.0);
                     ui.label(RichText::new(t!("wallets.pass_empty"))
                         .size(17.0)
-                        .color(Colors::INACTIVE_TEXT));
+                        .color(Colors::inactive_text()));
                 } else if self.wrong_pass {
                     ui.add_space(12.0);
                     ui.label(RichText::new(t!("wallets.wrong_pass"))
                         .size(17.0)
-                        .color(Colors::RED));
+                        .color(Colors::red()));
                 }
             });
             ui.add_space(12.0);
@@ -229,13 +229,13 @@ impl RecoverySetup {
 
                 ui.columns(2, |columns| {
                     columns[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                        View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                             self.recovery_phrase = None;
                             modal.close();
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
-                        View::button(ui, "OK".to_owned(), Colors::WHITE, || {
+                        View::button(ui, "OK".to_owned(), Colors::white_or_black(false), || {
                             match wallet.get_recovery(self.pass_edit.clone()) {
                                 Ok(phrase) => {
                                     self.wrong_pass = false;
@@ -263,7 +263,7 @@ impl RecoverySetup {
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("wallets.delete_conf"))
                 .size(17.0)
-                .color(Colors::TEXT));
+                .color(Colors::text(false)));
         });
         ui.add_space(12.0);
 
@@ -274,12 +274,12 @@ impl RecoverySetup {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("delete"), Colors::WHITE, || {
+                    View::button(ui, t!("delete"), Colors::white_or_black(false), || {
                         wallet.delete_wallet();
                         modal.close();
                     });

src/gui/views/wallets/wallet/content.rs

@@ -90,8 +90,8 @@ impl WalletContent {
             && !wallet.sync_error() && !wallet.is_repairing();
         egui::TopBottomPanel::top(Id::from("wallet_balance").with(wallet.identifier()))
             .frame(egui::Frame {
-                fill: Colors::FILL,
-                stroke: View::DEFAULT_STROKE,
+                fill: Colors::fill(),
+                stroke: View::default_stroke(),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,
@@ -118,8 +118,8 @@ impl WalletContent {
         // Show wallet tabs panel.
         egui::TopBottomPanel::bottom("wallet_tabs")
             .frame(egui::Frame {
-                stroke: View::ITEM_STROKE,
-                fill: Colors::FILL,
+                stroke: View::item_stroke(),
+                fill: Colors::fill(),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,
@@ -140,8 +140,8 @@ impl WalletContent {
         // Show tab content panel.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                fill: Colors::WHITE,
-                stroke: View::DEFAULT_STROKE,
+                fill: Colors::white_or_black(false),
+                stroke: View::default_stroke(),
                 ..Default::default()
             })
             .show_inside(ui, |ui| {
@@ -191,7 +191,7 @@ impl WalletContent {
         rect.set_height(75.0);
         // Draw round background.
         let rounding = View::item_rounding(0, 2, false);
-        ui.painter().rect(rect, rounding, Colors::BUTTON, View::HOVER_STROKE);
+        ui.painter().rect(rect, rounding, Colors::button(), View::hover_stroke());
 
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
             // Draw button to scan QR code.
@@ -228,7 +228,9 @@ impl WalletContent {
                     // Show spendable amount.
                     let amount = amount_to_hr_string(data.info.amount_currently_spendable, true);
                     let amount_text = format!("{} {}", amount, GRIN);
-                    ui.label(RichText::new(amount_text).size(18.0).color(Colors::BLACK));
+                    ui.label(RichText::new(amount_text)
+                        .size(18.0)
+                        .color(Colors::white_or_black(true)));
                     ui.add_space(-2.0);
 
                     // Show account label.
@@ -240,11 +242,11 @@ impl WalletContent {
                         account.to_owned()
                     };
                     let acc_text = format!("{} {}", FOLDER_USER, acc_label);
-                    View::ellipsize_text(ui, acc_text, 15.0, Colors::TEXT);
+                    View::ellipsize_text(ui, acc_text, 15.0, Colors::text(false));
 
                     // Show confirmed height.
                     let height_text = format!("{} {}", PACKAGE, data.info.last_confirmed_height);
-                    View::animate_text(ui, height_text, 15.0, Colors::GRAY, wallet.syncing());
+                    View::animate_text(ui, height_text, 15.0, Colors::gray(), wallet.syncing());
                 })
             });
         });
@@ -261,7 +263,7 @@ impl WalletContent {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("wallets.new_account_desc"))
                     .size(17.0)
-                    .color(Colors::GRAY));
+                    .color(Colors::gray()));
                 ui.add_space(8.0);
 
                 // Draw account name edit.
@@ -274,7 +276,7 @@ impl WalletContent {
                     ui.add_space(12.0);
                     ui.label(RichText::new(t!("error"))
                         .size(17.0)
-                        .color(Colors::RED));
+                        .color(Colors::red()));
                 }
                 ui.add_space(12.0);
             });
@@ -285,7 +287,7 @@ impl WalletContent {
             // Show modal buttons.
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         // Close modal.
                         cb.hide_keyboard();
                         modal.close();
@@ -311,7 +313,7 @@ impl WalletContent {
                         (on_create)();
                     });
 
-                    View::button(ui, t!("create"), Colors::WHITE, on_create);
+                    View::button(ui, t!("create"), Colors::white_or_black(false), on_create);
                 });
             });
             ui.add_space(6.0);
@@ -340,7 +342,7 @@ impl WalletContent {
                 });
 
             ui.add_space(2.0);
-            View::horizontal_line(ui, Colors::STROKE);
+            View::horizontal_line(ui, Colors::stroke());
             ui.add_space(6.0);
 
             // Setup spacing between buttons.
@@ -349,12 +351,12 @@ impl WalletContent {
             // Show modal buttons.
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("create"), Colors::WHITE, || {
+                    View::button(ui, t!("create"), Colors::white_or_black(false), || {
                         self.account_creating = true;
                         cb.show_keyboard();
                     });
@@ -373,7 +375,7 @@ impl WalletContent {
         // Show scan result if exists or show camera content while scanning.
         if let Some(result) = &self.qr_scan_result {
             let mut result_text = result.text();
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(3.0);
             ScrollArea::vertical()
                 .id_source(Id::from("qr_scan_result_input").with(wallet.get_config().id))
@@ -391,20 +393,20 @@ impl WalletContent {
                     ui.add_space(6.0);
                 });
             ui.add_space(2.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
 
             // Show copy button.
             ui.vertical_centered(|ui| {
                 let copy_text = format!("{} {}", COPY, t!("copy"));
-                View::button(ui, copy_text, Colors::BUTTON, || {
+                View::button(ui, copy_text, Colors::button(), || {
                     cb.copy_string_to_buffer(result_text.to_string());
                     self.qr_scan_result = None;
                     modal.close();
                 });
             });
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
         } else if let Some(result) = self.camera_content.qr_scan_result() {
             cb.stop_camera();
@@ -448,13 +450,13 @@ impl WalletContent {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("close"), Colors::WHITE, || {
+                    View::button(ui, t!("close"), Colors::white_or_black(false), || {
                         self.qr_scan_result = None;
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("repeat"), Colors::WHITE, || {
+                    View::button(ui, t!("repeat"), Colors::white_or_black(false), || {
                         Modal::set_title(t!("scan_qr"));
                         self.qr_scan_result = None;
                         cb.start_camera();
@@ -463,7 +465,7 @@ impl WalletContent {
             });
         } else {
             ui.vertical_centered_justified(|ui| {
-                View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                     cb.stop_camera();
                     modal.close();
                 });
@@ -524,7 +526,7 @@ impl WalletContent {
                 View::center_content(ui, 108.0, |ui| {
                     View::max_width_ui(ui, Root::SIDE_PANEL_WIDTH * 1.5, |ui| {
                         let text = t!("wallets.enable_node", "settings" => GEAR_FINE);
-                        ui.label(RichText::new(text).size(16.0).color(Colors::INACTIVE_TEXT));
+                        ui.label(RichText::new(text).size(16.0).color(Colors::inactive_text()));
                         ui.add_space(8.0);
                         // Show button to enable integrated node at non-dual root panel mode
                         // or when network connections are not showing and node is not stopping
@@ -532,7 +534,7 @@ impl WalletContent {
                         if (!dual_panel_root || AppConfig::show_connections_network_panel())
                             && !Node::is_stopping() {
                             let enable_text = format!("{} {}", POWER, t!("network.enable_node"));
-                            View::button(ui, enable_text, Colors::GOLD, || {
+                            View::action_button(ui, enable_text, || {
                                 Node::start();
                             });
                         }
@@ -561,10 +563,10 @@ impl WalletContent {
     fn sync_error_ui(ui: &mut egui::Ui, wallet: &Wallet) {
         View::center_content(ui, 108.0, |ui| {
             let text = t!("wallets.wallet_loading_err", "settings" => GEAR_FINE);
-            ui.label(RichText::new(text).size(16.0).color(Colors::INACTIVE_TEXT));
+            ui.label(RichText::new(text).size(16.0).color(Colors::inactive_text()));
             ui.add_space(8.0);
             let retry_text = format!("{} {}", ARROWS_CLOCKWISE, t!("retry"));
-            View::button(ui, retry_text, Colors::GOLD, || {
+            View::action_button(ui, retry_text, || {
                 wallet.set_sync_error(false);
             });
         });
@@ -620,7 +622,7 @@ impl WalletContent {
                         }
                     }
                 };
-                ui.label(RichText::new(text).size(16.0).color(Colors::INACTIVE_TEXT));
+                ui.label(RichText::new(text).size(16.0).color(Colors::inactive_text()));
             });
         });
     }
@@ -642,7 +644,7 @@ fn account_item_ui(ui: &mut egui::Ui,
     // Draw round background.
     let bg_rect = rect.clone();
     let item_rounding = View::item_rounding(index, size, false);
-    ui.painter().rect(bg_rect, item_rounding, Colors::FILL, View::ITEM_STROKE);
+    ui.painter().rect(bg_rect, item_rounding, Colors::fill(), View::item_stroke());
 
     ui.vertical(|ui| {
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -656,7 +658,7 @@ fn account_item_ui(ui: &mut egui::Ui,
                 });
             } else {
                 ui.add_space(12.0);
-                ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::GREEN));
+                ui.label(RichText::new(CHECK_FAT).size(20.0).color(Colors::green()));
             }
 
             let layout_size = ui.available_size();
@@ -667,7 +669,7 @@ fn account_item_ui(ui: &mut egui::Ui,
                     // Show spendable amount.
                     let amount = amount_to_hr_string(acc.spendable_amount, true);
                     let amount_text = format!("{} {}", amount, GRIN);
-                    ui.label(RichText::new(amount_text).size(18.0).color(Colors::BLACK));
+                    ui.label(RichText::new(amount_text).size(18.0).color(Colors::white_or_black(true)));
                     ui.add_space(-2.0);
 
                     // Show account name.
@@ -678,11 +680,11 @@ fn account_item_ui(ui: &mut egui::Ui,
                         acc.label.to_owned()
                     };
                     let acc_name = format!("{} {}", FOLDER_USER, acc_label);
-                    View::ellipsize_text(ui, acc_name, 15.0, Colors::TEXT);
+                    View::ellipsize_text(ui, acc_name, 15.0, Colors::text(false));
 
                     // Show account BIP32 derivation path.
                     let acc_path = format!("{} {}", PATH, acc.path);
-                    ui.label(RichText::new(acc_path).size(15.0).color(Colors::GRAY));
+                    ui.label(RichText::new(acc_path).size(15.0).color(Colors::gray()));
                     ui.add_space(3.0);
                 });
             });

src/gui/views/wallets/wallet/messages.rs

@@ -127,11 +127,10 @@ impl WalletTab for WalletMessages {
         // Show modal content for this ui container.
         self.modal_content_ui(ui, wallet, cb);
 
-        // Show manual wallet content panel.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                stroke: View::ITEM_STROKE,
-                fill: Colors::WHITE,
+                stroke: View::item_stroke(),
+                fill: Colors::white_or_black(false),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,
@@ -194,7 +193,7 @@ impl WalletMessages {
         self.request_ui(ui, wallet, cb);
 
         ui.add_space(12.0);
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(6.0);
 
         // Show Slatepack message input field.
@@ -240,7 +239,7 @@ impl WalletMessages {
                   cb: &dyn PlatformCallbacks) {
         ui.label(RichText::new(t!("wallets.create_request_desc"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT));
+            .color(Colors::inactive_text()));
         ui.add_space(7.0);
 
         // Show send button only if balance is not empty.
@@ -253,7 +252,7 @@ impl WalletMessages {
                 columns[0].vertical_centered_justified(|ui| {
                     // Draw sending request creation button.
                     let send_text = format!("{} {}", UPLOAD_SIMPLE, t!("wallets.send"));
-                    View::colored_text_button(ui, send_text, Colors::RED, Colors::BUTTON, || {
+                    View::colored_text_button(ui, send_text, Colors::red(), Colors::button(), || {
                         self.show_request_modal(false, cb);
                     });
                 });
@@ -271,7 +270,7 @@ impl WalletMessages {
     /// Draw invoice request creation button.
     fn receive_button_ui(&mut self, ui: &mut egui::Ui, cb: &dyn PlatformCallbacks) {
         let receive_text = format!("{} {}", DOWNLOAD_SIMPLE, t!("wallets.receive"));
-        View::colored_text_button(ui, receive_text, Colors::GREEN, Colors::BUTTON, || {
+        View::colored_text_button(ui, receive_text, Colors::green(), Colors::button(), || {
             self.show_request_modal(true, cb);
         });
     }
@@ -358,7 +357,7 @@ impl WalletMessages {
                 };
                 ui.label(RichText::new(enter_text)
                     .size(17.0)
-                    .color(Colors::GRAY));
+                    .color(Colors::gray()));
             });
             ui.add_space(8.0);
 
@@ -412,7 +411,7 @@ impl WalletMessages {
                 ui.vertical_centered(|ui| {
                     ui.label(RichText::new(self.request_error.clone().unwrap().text())
                         .size(17.0)
-                        .color(Colors::RED));
+                        .color(Colors::red()));
                 });
             }
 
@@ -423,7 +422,7 @@ impl WalletMessages {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         self.request_amount_edit = "".to_string();
                         self.request_error = None;
                         cb.hide_keyboard();
@@ -432,7 +431,7 @@ impl WalletMessages {
                 });
                 columns[1].vertical_centered_justified(|ui| {
                     // Button to create Slatepack message request.
-                    View::button(ui, t!("continue"), Colors::WHITE, || {
+                    View::button(ui, t!("continue"), Colors::white_or_black(false), || {
                         if self.request_amount_edit.is_empty() {
                             return;
                         }
@@ -472,7 +471,7 @@ impl WalletMessages {
                 } else {
                     t!("wallets.send_request_desc","amount" => amount_format)
                 };
-                ui.label(RichText::new(desc_text).size(16.0).color(Colors::GRAY));
+                ui.label(RichText::new(desc_text).size(16.0).color(Colors::gray()));
             });
             ui.add_space(6.0);
 
@@ -488,7 +487,7 @@ impl WalletMessages {
 
                 // Show button to close modal.
                 ui.vertical_centered_justified(|ui| {
-                    View::button(ui, t!("close"), Colors::WHITE, || {
+                    View::button(ui, t!("close"), Colors::white_or_black(false), || {
                         self.request_qr_content.clear_state();
                         self.request_qr = false;
                         modal.close();
@@ -498,7 +497,7 @@ impl WalletMessages {
                 return;
             }
 
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(3.0);
 
             // Draw request Slatepack message text.
@@ -526,7 +525,7 @@ impl WalletMessages {
                     ui.add_space(6.0);
                 });
             ui.add_space(2.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
 
             ui.add_space(10.0);
 
@@ -538,14 +537,14 @@ impl WalletMessages {
                     columns[0].vertical_centered_justified(|ui| {
                         // Draw button to show request as QR code.
                         let qr_text = format!("{} {}", QR_CODE, t!("qr_code"));
-                        View::button(ui, qr_text, Colors::BUTTON, || {
+                        View::button(ui, qr_text, Colors::button(), || {
                             self.request_qr = true;
                         });
                     });
                     columns[1].vertical_centered_justified(|ui| {
                         // Draw button to copy request to clipboard.
                         let copy_text = format!("{} {}", COPY, t!("copy"));
-                        View::button(ui, copy_text, Colors::BUTTON, || {
+                        View::button(ui, copy_text, Colors::button(), || {
                             cb.copy_string_to_buffer(self.request_edit.clone());
                             self.request_amount_edit = "".to_string();
                             self.request_edit = "".to_string();
@@ -560,7 +559,7 @@ impl WalletMessages {
                     columns[0].vertical_centered_justified(|ui| {
                         // Draw button to cancel transaction.
                         let cancel = t!("modal.cancel");
-                        View::colored_text_button(ui, cancel, Colors::RED, Colors::BUTTON, || {
+                        View::colored_text_button(ui, cancel, Colors::red(), Colors::button(), || {
                             if let Ok(slate) = wallet.parse_slatepack(&self.request_edit) {
                                 if let Some(tx) = wallet.tx_by_slate(&slate) {
                                     wallet.cancel(tx.data.id);
@@ -574,7 +573,7 @@ impl WalletMessages {
                     });
                     columns[1].vertical_centered_justified(|ui| {
                         // Draw button to close modal.
-                        View::button(ui, t!("close"), Colors::WHITE, || {
+                        View::button(ui, t!("close"), Colors::white_or_black(false), || {
                             self.request_amount_edit = "".to_string();
                             self.request_edit = "".to_string();
                             modal.close();
@@ -595,7 +594,7 @@ impl WalletMessages {
         let empty_fields = self.message_edit.is_empty() && self.request_edit.is_empty();
         let response_empty = self.response_edit.is_empty();
         if let Some(err) = &self.message_error {
-            ui.label(RichText::new(err.text()).size(16.0).color(Colors::RED));
+            ui.label(RichText::new(err.text()).size(16.0).color(Colors::red()));
         } else {
             let desc_text = if self.message_slate.is_none() || empty_fields {
                 t!("wallets.input_slatepack_desc")
@@ -626,7 +625,7 @@ impl WalletMessages {
                     }
                 }
             };
-            ui.label(RichText::new(desc_text).size(16.0).color(Colors::INACTIVE_TEXT));
+            ui.label(RichText::new(desc_text).size(16.0).color(Colors::inactive_text()));
         }
         ui.add_space(6.0);
 
@@ -640,7 +639,7 @@ impl WalletMessages {
         // Save message to check for changes.
         let message_before = message.clone();
 
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(3.0);
         let scroll_id = Id::from(
             if response_empty {
@@ -676,7 +675,7 @@ impl WalletMessages {
                 ui.add_space(6.0);
             });
         ui.add_space(2.0);
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(10.0);
 
         // Parse Slatepack message if input field was changed, resetting message error.
@@ -697,7 +696,7 @@ impl WalletMessages {
                         if self.response_edit.is_empty() {
                             // Draw button to clear message input.
                             let clear_text = format!("{} {}", BROOM, t!("clear"));
-                            View::button(ui, clear_text, Colors::BUTTON, || {
+                            View::button(ui, clear_text, Colors::button(), || {
                                 self.message_edit.clear();
                                 self.response_edit.clear();
                                 self.message_error = None;
@@ -706,7 +705,7 @@ impl WalletMessages {
                         } else {
                             // Draw button to show Slatepack message as QR code.
                             let qr_text = format!("{} {}", QR_CODE, t!("qr_code"));
-                            View::button(ui, qr_text, Colors::BUTTON, || {
+                            View::button(ui, qr_text, Colors::button(), || {
                                 let text = self.response_edit.clone();
                                 self.message_edit.clear();
                                 self.response_edit.clear();
@@ -721,7 +720,7 @@ impl WalletMessages {
                         } else {
                             // Draw button to scan Slatepack message QR code.
                             let scan_text = format!("{} {}", SCAN, t!("scan"));
-                            View::button(ui, scan_text, Colors::BUTTON, || {
+                            View::button(ui, scan_text, Colors::button(), || {
                                 self.message_edit.clear();
                                 self.message_error = None;
                                 self.show_qr_message_scan_modal(cb);
@@ -738,7 +737,7 @@ impl WalletMessages {
                             if !self.response_edit.is_empty() {
                                 // Draw button to copy response to clipboard.
                                 let copy_text = format!("{} {}", COPY, t!("copy"));
-                                View::button(ui, copy_text, Colors::BUTTON, || {
+                                View::button(ui, copy_text, Colors::button(), || {
                                     cb.copy_string_to_buffer(self.response_edit.clone());
                                     self.message_edit.clear();
                                     self.response_edit.clear();
@@ -747,7 +746,7 @@ impl WalletMessages {
                             } else {
                                 show_dandelion = true;
                                 // Draw button to finalize or repost transaction.
-                                View::button(ui, t!("wallets.finalize"), Colors::GOLD, || {
+                                View::action_button(ui, t!("wallets.finalize"), || {
                                     let slate = self.message_slate.clone().unwrap();
                                     self.message_slate = None;
                                     let dandelion = self.dandelion;
@@ -779,7 +778,7 @@ impl WalletMessages {
                         } else {
                             // Draw button to paste text from clipboard.
                             let paste = format!("{} {}", CLIPBOARD_TEXT, t!("paste"));
-                            View::button(ui, paste, Colors::BUTTON, || {
+                            View::button(ui, paste, Colors::button(), || {
                                 let buf = cb.get_string_from_buffer();
                                 let previous = self.message_edit.clone();
                                 self.message_edit = buf.clone().trim().to_string();
@@ -800,7 +799,7 @@ impl WalletMessages {
                 if self.message_slate.is_none() && !self.message_edit.is_empty() {
                     // Draw button to clear message input.
                     let clear_text = format!("{} {}", BROOM, t!("clear"));
-                    View::button(ui, clear_text, Colors::BUTTON, || {
+                    View::button(ui, clear_text, Colors::button(), || {
                         self.message_edit.clear();
                         self.response_edit.clear();
                         self.message_error = None;
@@ -809,7 +808,7 @@ impl WalletMessages {
                 } else if !self.response_edit.is_empty() && self.message_slate.is_some() {
                     // Draw cancel button.
                     let cancel = format!("{} {}", PROHIBIT, t!("modal.cancel"));
-                    View::colored_text_button(ui, cancel, Colors::RED, Colors::BUTTON, || {
+                    View::colored_text_button(ui, cancel, Colors::red(), Colors::button(), || {
                         let slate = self.message_slate.clone().unwrap();
                         if let Some(tx) = wallet.tx_by_slate(&slate) {
                             wallet.cancel(tx.data.id);
@@ -861,7 +860,7 @@ impl WalletMessages {
             } else {
                 t!("wallets.parse_i1_slatepack_desc","amount" => amount)
             };
-            ui.label(RichText::new(title).size(16.0).color(Colors::INACTIVE_TEXT));
+            ui.label(RichText::new(title).size(16.0).color(Colors::inactive_text()));
         });
         ui.add_space(6.0);
 
@@ -871,7 +870,7 @@ impl WalletMessages {
         ui.add_space(6.0);
 
         ui.vertical_centered_justified(|ui| {
-            View::button(ui, t!("close"), Colors::WHITE, || {
+            View::button(ui, t!("close"), Colors::white_or_black(false), || {
                 self.qr_message_text = None;
                 self.qr_message_content.clear_state();
                 self.response_edit.clear();
@@ -906,7 +905,7 @@ impl WalletMessages {
                 let err_text = format!("{}", t!("wallets.parse_slatepack_err")).replace(":", ".");
                 ui.label(RichText::new(err_text)
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             });
             ui.add_space(12.0);
 
@@ -915,13 +914,13 @@ impl WalletMessages {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("close"), Colors::WHITE, || {
+                    View::button(ui, t!("close"), Colors::white_or_black(false), || {
                         self.message_scan_error = false;
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("repeat"), Colors::WHITE, || {
+                    View::button(ui, t!("repeat"), Colors::white_or_black(false), || {
                         Modal::set_title(t!("scan_qr"));
                         self.message_scan_error = false;
                         cb.start_camera();
@@ -950,7 +949,7 @@ impl WalletMessages {
         }
 
         ui.vertical_centered_justified(|ui| {
-            View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+            View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                 cb.stop_camera();
                 modal.close();
             });

src/gui/views/wallets/wallet/settings.rs

@@ -64,8 +64,8 @@ impl WalletTab for WalletSettings {
         // Show settings content panel.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                stroke: View::DEFAULT_STROKE,
-                fill: Colors::WHITE,
+                stroke: View::default_stroke(),
+                fill: Colors::white_or_black(false),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,

src/gui/views/wallets/wallet/transport.rs

@@ -90,8 +90,8 @@ impl WalletTab for WalletTransport {
         // Show transport content panel.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                stroke: View::ITEM_STROKE,
-                fill: Colors::WHITE,
+                stroke: View::item_stroke(),
+                fill: Colors::white_or_black(false),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,
@@ -159,7 +159,7 @@ impl WalletTransport {
         ui.add_space(3.0);
         ui.label(RichText::new(t!("transport.desc"))
             .size(16.0)
-            .color(Colors::INACTIVE_TEXT));
+            .color(Colors::inactive_text()));
         ui.add_space(7.0);
 
         // Draw Tor content.
@@ -223,7 +223,7 @@ impl WalletTransport {
         // Draw round background.
         let bg_rect = rect.clone();
         let item_rounding = View::item_rounding(0, 2, false);
-        ui.painter().rect(bg_rect, item_rounding, Colors::BUTTON, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, item_rounding, Colors::button(), View::item_stroke());
 
         ui.vertical(|ui| {
             ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -237,14 +237,14 @@ impl WalletTransport {
                 let service_id = &wallet.identifier();
                 if  !Tor::is_service_starting(service_id) && wallet.foreign_api_port().is_some() {
                     if !Tor::is_service_running(service_id) {
-                        View::item_button(ui, Rounding::default(), POWER, Some(Colors::GREEN), || {
+                        View::item_button(ui, Rounding::default(), POWER, Some(Colors::green()), || {
                             if let Ok(key) = wallet.secret_key() {
                                 let api_port = wallet.foreign_api_port().unwrap();
                                 Tor::start_service(api_port, key, service_id);
                             }
                         });
                     } else {
-                        View::item_button(ui, Rounding::default(), POWER, Some(Colors::RED), || {
+                        View::item_button(ui, Rounding::default(), POWER, Some(Colors::red()), || {
                             Tor::stop_service(service_id);
                         });
                     }
@@ -257,7 +257,7 @@ impl WalletTransport {
                         ui.add_space(3.0);
                         ui.label(RichText::new(t!("transport.tor_network"))
                             .size(18.0)
-                            .color(Colors::TITLE));
+                            .color(Colors::title(false)));
 
                         // Setup bridges status text.
                         let bridge = TorConfig::get_bridge();
@@ -272,7 +272,7 @@ impl WalletTransport {
                                         t!("transport.bridge_name", "b" = name))
                             }
                         };
-                        ui.label(RichText::new(bridges_text).size(15.0).color(Colors::TEXT));
+                        ui.label(RichText::new(bridges_text).size(15.0).color(Colors::text(false)));
                         ui.add_space(1.0);
 
                         // Setup Tor status text.
@@ -291,7 +291,7 @@ impl WalletTransport {
                             (X_CIRCLE, t!("transport.disconnected"))
                         };
                         let status_text = format!("{} {}", icon, text);
-                        ui.label(RichText::new(status_text).size(15.0).color(Colors::GRAY));
+                        ui.label(RichText::new(status_text).size(15.0).color(Colors::gray()));
                     });
                 });
             });
@@ -340,13 +340,13 @@ impl WalletTransport {
                 // Show buttons to close modal or come back to sending input.
                 ui.columns(2, |cols| {
                     cols[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("close"), Colors::WHITE, || {
+                        View::button(ui, t!("close"), Colors::white_or_black(false), || {
                             on_stop(&mut self.bridge_qr_scan_content);
                             modal.close();
                         });
                     });
                     cols[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("back"), Colors::WHITE, || {
+                        View::button(ui, t!("back"), Colors::white_or_black(false), || {
                             on_stop(&mut self.bridge_qr_scan_content);
                         });
                     });
@@ -364,7 +364,7 @@ impl WalletTransport {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("transport.bridges_desc"))
                     .size(17.0)
-                    .color(Colors::INACTIVE_TEXT));
+                    .color(Colors::inactive_text()));
 
                 // Draw checkbox to enable/disable bridges.
                 View::checkbox(ui, bridge.is_some(), t!("transport.bridges"), || {
@@ -423,7 +423,7 @@ impl WalletTransport {
                 ui.vertical_centered(|ui| {
                     ui.label(RichText::new(t!("transport.bin_file"))
                         .size(17.0)
-                        .color(Colors::INACTIVE_TEXT));
+                        .color(Colors::inactive_text()));
                     ui.add_space(6.0);
                     View::text_edit(ui, cb, &mut self.bridge_bin_path_edit, &mut bin_edit_opts);
                     ui.add_space(6.0);
@@ -441,7 +441,7 @@ impl WalletTransport {
                 ui.vertical_centered(|ui| {
                     ui.label(RichText::new(t!("transport.conn_line"))
                         .size(17.0)
-                        .color(Colors::INACTIVE_TEXT));
+                        .color(Colors::inactive_text()));
                     ui.add_space(6.0);
                     View::text_edit(ui, cb, &mut self.bridge_conn_line_edit, &mut conn_edit_opts);
                     // Check if scan button was pressed.
@@ -474,14 +474,14 @@ impl WalletTransport {
             }
 
             ui.add_space(6.0);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(6.0);
         }
 
         ui.vertical_centered(|ui| {
             ui.label(RichText::new(t!("transport.tor_autorun_desc"))
                 .size(17.0)
-                .color(Colors::INACTIVE_TEXT));
+                .color(Colors::inactive_text()));
 
             // Show Tor service autorun checkbox.
             let autorun = wallet.auto_start_tor_listener();
@@ -491,7 +491,7 @@ impl WalletTransport {
         });
         ui.add_space(6.0);
         ui.vertical_centered_justified(|ui| {
-            View::button(ui, t!("close"), Colors::WHITE, || {
+            View::button(ui, t!("close"), Colors::white_or_black(false), || {
                 if self.tor_settings_changed {
                     self.tor_settings_changed = false;
                     // Restart running service or rebuild client.
@@ -532,7 +532,7 @@ impl WalletTransport {
         } else {
             View::item_rounding(1, 2, false)
         };
-        ui.painter().rect(bg_rect, item_rounding, Colors::BUTTON, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, item_rounding, Colors::button(), View::item_stroke());
 
         ui.vertical(|ui| {
             ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
@@ -565,18 +565,18 @@ impl WalletTransport {
                         // Show wallet Slatepack address.
                         let address_color = if Tor::is_service_starting(service_id) ||
                             wallet.foreign_api_port().is_none() {
-                            Colors::INACTIVE_TEXT
+                            Colors::inactive_text()
                         } else if Tor::is_service_running(service_id) {
-                            Colors::GREEN
+                            Colors::green()
                         } else {
-                            Colors::RED
+                            Colors::red()
                         };
                         View::ellipsize_text(ui, slatepack_addr, 15.0, address_color);
 
                         let address_label = format!("{} {}",
                                                     GLOBE_SIMPLE,
                                                     t!("network_mining.address"));
-                        ui.label(RichText::new(address_label).size(15.0).color(Colors::GRAY));
+                        ui.label(RichText::new(address_label).size(15.0).color(Colors::gray()));
                     });
                 });
             });
@@ -593,7 +593,7 @@ impl WalletTransport {
         ui.add_space(10.0);
 
         ui.vertical_centered_justified(|ui| {
-            View::button(ui, t!("close"), Colors::WHITE, || {
+            View::button(ui, t!("close"), Colors::white_or_black(false), || {
                 self.qr_address_content.clear_state();
                 m.close();
             });
@@ -610,14 +610,14 @@ impl WalletTransport {
         // Draw round background.
         let bg_rect = rect.clone();
         let item_rounding = View::item_rounding(1, 2, false);
-        ui.painter().rect(bg_rect, item_rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, item_rounding, Colors::fill(), View::item_stroke());
 
         ui.vertical(|ui| {
             ui.allocate_ui_with_layout(rect.size(), Layout::top_down(Align::Center), |ui| {
                 ui.add_space(7.0);
                 // Draw button to open sending modal.
                 let send_text = format!("{} {}", EXPORT, t!("wallets.send"));
-                View::button(ui, send_text, Colors::WHITE, || {
+                View::button(ui, send_text, Colors::white_or_black(false), || {
                     self.show_send_tor_modal(cb, None);
                 });
             });
@@ -699,13 +699,13 @@ impl WalletTransport {
                     // Show buttons to close modal or come back to sending input.
                     ui.columns(2, |cols| {
                         cols[0].vertical_centered_justified(|ui| {
-                            View::button(ui, t!("close"), Colors::WHITE, || {
+                            View::button(ui, t!("close"), Colors::white_or_black(false), || {
                                 on_stop(&mut self.address_scan_content);
                                 modal.close();
                             });
                         });
                         cols[1].vertical_centered_justified(|ui| {
-                            View::button(ui, t!("back"), Colors::WHITE, || {
+                            View::button(ui, t!("back"), Colors::white_or_black(false), || {
                                 self.modal_just_opened = true;
                                 on_stop(&mut self.address_scan_content);
                                 cb.show_keyboard();
@@ -723,7 +723,7 @@ impl WalletTransport {
                 let enter_text = t!("wallets.enter_amount_send","amount" => amount);
                 ui.label(RichText::new(enter_text)
                     .size(17.0)
-                    .color(Colors::GRAY));
+                    .color(Colors::gray()));
             });
             ui.add_space(8.0);
 
@@ -778,11 +778,11 @@ impl WalletTransport {
                 if self.address_error {
                     ui.label(RichText::new(t!("transport.incorrect_addr_err"))
                         .size(17.0)
-                        .color(Colors::RED));
+                        .color(Colors::red()));
                 } else {
                     ui.label(RichText::new(t!("transport.receiver_address"))
                         .size(17.0)
-                        .color(Colors::GRAY));
+                        .color(Colors::gray()));
                 }
             });
             ui.add_space(6.0);
@@ -814,7 +814,7 @@ impl WalletTransport {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         self.amount_edit = "".to_string();
                         self.address_edit = "".to_string();
                         cb.hide_keyboard();
@@ -822,7 +822,7 @@ impl WalletTransport {
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("continue"), Colors::WHITE, || {
+                    View::button(ui, t!("continue"), Colors::white_or_black(false), || {
                         if self.amount_edit.is_empty() {
                             return;
                         }
@@ -869,7 +869,7 @@ impl WalletTransport {
             ui.vertical_centered(|ui| {
                 ui.label(RichText::new(t!("transport.tor_send_error"))
                     .size(17.0)
-                    .color(Colors::RED));
+                    .color(Colors::red()));
             });
             ui.add_space(12.0);
 
@@ -878,7 +878,7 @@ impl WalletTransport {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         self.amount_edit = "".to_string();
                         self.address_edit = "".to_string();
                         cb.hide_keyboard();
@@ -886,7 +886,7 @@ impl WalletTransport {
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("repeat"), Colors::WHITE, || {
+                    View::button(ui, t!("repeat"), Colors::white_or_black(false), || {
                         // Parse amount and send over Tor.
                         if let Ok(a) = amount_from_hr_string(self.amount_edit.as_str()) {
                             let mut w_send_error = self.tor_send_error.write();
@@ -929,7 +929,7 @@ impl WalletTransport {
                 ui.add_space(12.0);
                 ui.label(RichText::new(t!("transport.tor_sending", "amount" => self.amount_edit))
                     .size(17.0)
-                    .color(Colors::GRAY));
+                    .color(Colors::gray()));
             });
             ui.add_space(10.0);
 

src/gui/views/wallets/wallet/txs.rs

@@ -109,8 +109,8 @@ impl WalletTab for WalletTransactions {
         // Show wallet transactions panel.
         egui::CentralPanel::default()
             .frame(egui::Frame {
-                stroke: View::ITEM_STROKE,
-                fill: Colors::BUTTON,
+                stroke: View::item_stroke(),
+                fill: Colors::button(),
                 inner_margin: Margin {
                     left: View::far_left_inset_margin(ui) + 4.0,
                     right: View::get_right_inset() + 4.0,
@@ -196,7 +196,7 @@ impl WalletTransactions {
                             "transport" => BRIDGE,
                             "settings" => GEAR_FINE
                         );
-                    ui.label(RichText::new(empty_text).size(16.0).color(Colors::INACTIVE_TEXT));
+                    ui.label(RichText::new(empty_text).size(16.0).color(Colors::inactive_text()));
                 });
                 return;
             }
@@ -302,11 +302,11 @@ impl WalletTransactions {
         // Draw round background.
         let bg_rect = rect.clone();
         let color = if can_show_info {
-            Colors::BUTTON
+            Colors::button()
         } else {
-            Colors::FILL
+            Colors::fill()
         };
-        ui.painter().rect(bg_rect, rounding, color, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, rounding, color, View::item_stroke());
 
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
             // Draw button to show transaction info.
@@ -326,7 +326,7 @@ impl WalletTransactions {
                 let (icon, color) = if !can_show_info && self.tx_info_finalize {
                     (FILE_TEXT, None)
                 } else {
-                    (CHECK, Some(Colors::GREEN))
+                    (CHECK, Some(Colors::green()))
                 };
                 let final_rounding = if can_show_info {
                     Rounding::default()
@@ -352,7 +352,7 @@ impl WalletTransactions {
             let wallet_loaded = wallet.foreign_api_port().is_some();
             if ((!can_show_info && !self.tx_info_finalizing) || can_show_info) &&
                 (tx.can_repost(data) || tx.can_cancel()) && wallet_loaded {
-                View::item_button(ui, Rounding::default(), PROHIBIT, Some(Colors::RED), || {
+                View::item_button(ui, Rounding::default(), PROHIBIT, Some(Colors::red()), || {
                     if can_show_info {
                         self.confirm_cancel_tx_id = Some(tx.data.id);
                         // Show transaction cancellation confirmation modal.
@@ -376,7 +376,7 @@ impl WalletTransactions {
                     rounding.sw = 0.0;
                     rounding
                 };
-                View::item_button(ui, repost_rounding, ARROW_CLOCKWISE, Some(Colors::GREEN), || {
+                View::item_button(ui, repost_rounding, ARROW_CLOCKWISE, Some(Colors::green()), || {
                     // Post tx after getting slate from slatepack file.
                     if let Some((s, _)) = wallet.read_slate_by_tx(tx) {
                         let _ = wallet.post(&s, wallet.can_use_dandelion());
@@ -407,12 +407,12 @@ impl WalletTransactions {
 
                     // Setup amount color.
                     let amount_color = match tx.data.tx_type {
-                        TxLogEntryType::ConfirmedCoinbase => Colors::BLACK,
-                        TxLogEntryType::TxReceived => Colors::BLACK,
-                        TxLogEntryType::TxSent => Colors::BLACK,
-                        TxLogEntryType::TxReceivedCancelled => Colors::TEXT,
-                        TxLogEntryType::TxSentCancelled => Colors::TEXT,
-                        TxLogEntryType::TxReverted => Colors::TEXT
+                        TxLogEntryType::ConfirmedCoinbase => Colors::white_or_black(true),
+                        TxLogEntryType::TxReceived => Colors::white_or_black(true),
+                        TxLogEntryType::TxSent => Colors::white_or_black(true),
+                        TxLogEntryType::TxReceivedCancelled => Colors::text(false),
+                        TxLogEntryType::TxSentCancelled => Colors::text(false),
+                        TxLogEntryType::TxReverted => Colors::text(false)
                     };
                     View::ellipsize_text(ui, amount_text, 18.0, amount_color);
                     ui.add_space(-2.0);
@@ -484,27 +484,27 @@ impl WalletTransactions {
 
                     // Setup status text color.
                     let status_color = match tx.data.tx_type {
-                        TxLogEntryType::ConfirmedCoinbase => Colors::TEXT,
+                        TxLogEntryType::ConfirmedCoinbase => Colors::text(false),
                         TxLogEntryType::TxReceived => if tx.data.confirmed {
-                            Colors::GREEN
+                            Colors::green()
                         } else {
-                            Colors::TEXT
+                            Colors::text(false)
                         },
                         TxLogEntryType::TxSent => if tx.data.confirmed {
-                            Colors::RED
+                            Colors::red()
                         } else {
-                            Colors::TEXT
+                            Colors::text(false)
                         },
-                        TxLogEntryType::TxReceivedCancelled => Colors::INACTIVE_TEXT,
-                        TxLogEntryType::TxSentCancelled => Colors::INACTIVE_TEXT,
-                        TxLogEntryType::TxReverted => Colors::INACTIVE_TEXT,
+                        TxLogEntryType::TxReceivedCancelled => Colors::inactive_text(),
+                        TxLogEntryType::TxSentCancelled => Colors::inactive_text(),
+                        TxLogEntryType::TxReverted => Colors::inactive_text(),
                     };
                     ui.label(RichText::new(status_text).size(15.0).color(status_color));
 
                     // Setup transaction time.
                     let tx_time = View::format_time(tx.data.creation_ts.timestamp());
                     let tx_time_text = format!("{} {}", CALENDAR_CHECK, tx_time);
-                    ui.label(RichText::new(tx_time_text).size(15.0).color(Colors::GRAY));
+                    ui.label(RichText::new(tx_time_text).size(15.0).color(Colors::gray()));
                     ui.add_space(3.0);
                 });
             });
@@ -570,14 +570,14 @@ impl WalletTransactions {
                 // Show buttons to close modal or come back to text request content.
                 ui.columns(2, |cols| {
                     cols[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("close"), Colors::WHITE, || {
+                        View::button(ui, t!("close"), Colors::white_or_black(false), || {
                             self.tx_info_qr_code_content.clear_state();
                             self.tx_info_show_qr = false;
                             modal.close();
                         });
                     });
                     cols[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("back"), Colors::WHITE, || {
+                        View::button(ui, t!("back"), Colors::white_or_black(false), || {
                             self.tx_info_qr_code_content.clear_state();
                             self.tx_info_show_qr = false;
                         });
@@ -587,14 +587,14 @@ impl WalletTransactions {
                 // Show buttons to close modal or scanner.
                 ui.columns(2, |cols| {
                     cols[0].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("close"), Colors::WHITE, || {
+                        View::button(ui, t!("close"), Colors::white_or_black(false), || {
                             cb.stop_camera();
                             self.tx_info_show_scanner = false;
                             modal.close();
                         });
                     });
                     cols[1].vertical_centered_justified(|ui| {
-                        View::button(ui, t!("back"), Colors::WHITE, || {
+                        View::button(ui, t!("back"), Colors::white_or_black(false), || {
                             cb.stop_camera();
                             self.tx_info_show_scanner = false;
                             modal.enable_closing();
@@ -604,7 +604,7 @@ impl WalletTransactions {
             } else {
                 // Show button to close modal.
                 ui.vertical_centered_justified(|ui| {
-                    View::button(ui, t!("close"), Colors::WHITE, || {
+                    View::button(ui, t!("close"), Colors::white_or_black(false), || {
                         self.tx_info_id = None;
                         self.tx_info_finalize = false;
                         cb.hide_keyboard();
@@ -660,7 +660,7 @@ impl WalletTransactions {
         let bg_rect = rect.clone();
         let mut rounding = View::item_rounding(1, 3, false);
 
-        ui.painter().rect(bg_rect, rounding, Colors::FILL, View::ITEM_STROKE);
+        ui.painter().rect(bg_rect, rounding, Colors::fill(), View::item_stroke());
 
         ui.allocate_ui_with_layout(rect.size(), Layout::right_to_left(Align::Center), |ui| {
             // Draw button to copy transaction info value.
@@ -678,8 +678,8 @@ impl WalletTransactions {
                 ui.add_space(6.0);
                 ui.vertical(|ui| {
                     ui.add_space(3.0);
-                    View::ellipsize_text(ui, value, 15.0, Colors::TITLE);
-                    ui.label(RichText::new(label).size(15.0).color(Colors::GRAY));
+                    View::ellipsize_text(ui, value, 15.0, Colors::title(false));
+                    ui.label(RichText::new(label).size(15.0).color(Colors::gray()));
                     ui.add_space(3.0);
                 });
             });
@@ -734,9 +734,9 @@ impl WalletTransactions {
                     }
                 };
                 let desc_color = if self.tx_info_finalize_error {
-                    Colors::RED
+                    Colors::red()
                 } else {
-                    Colors::GRAY
+                    Colors::gray()
                 };
                 ui.label(RichText::new(desc_text).size(16.0).color(desc_color));
             } else {
@@ -753,7 +753,7 @@ impl WalletTransactions {
                         t!("wallets.parse_s1_slatepack_desc", "amount" => amount)
                     }
                 };
-                ui.label(RichText::new(desc_text).size(16.0).color(Colors::GRAY));
+                ui.label(RichText::new(desc_text).size(16.0).color(Colors::gray()));
             }
         });
         ui.add_space(6.0);
@@ -785,7 +785,7 @@ impl WalletTransactions {
             } else {
                 Id::from("tx_info_message_request")
             }.with(slate.id).with(tx.data.id);
-            View::horizontal_line(ui, Colors::ITEM_STROKE);
+            View::horizontal_line(ui, Colors::item_stroke());
             ui.add_space(3.0);
             ScrollArea::vertical()
                 .id_source(input_id)
@@ -806,7 +806,7 @@ impl WalletTransactions {
         });
 
         ui.add_space(2.0);
-        View::horizontal_line(ui, Colors::ITEM_STROKE);
+        View::horizontal_line(ui, Colors::item_stroke());
         ui.add_space(8.0);
 
         // Do not show buttons on finalization.
@@ -822,7 +822,7 @@ impl WalletTransactions {
                 columns[0].vertical_centered_justified(|ui| {
                     // Draw button to scan Slatepack message QR code.
                     let qr_text = format!("{} {}", SCAN, t!("scan"));
-                    View::button(ui, qr_text, Colors::BUTTON, || {
+                    View::button(ui, qr_text, Colors::button(), || {
                         cb.hide_keyboard();
                         modal.disable_closing();
                         cb.start_camera();
@@ -832,7 +832,7 @@ impl WalletTransactions {
                 columns[1].vertical_centered_justified(|ui| {
                     // Draw button to paste data from clipboard.
                     let paste_text = format!("{} {}", CLIPBOARD_TEXT, t!("paste"));
-                    View::button(ui, paste_text, Colors::BUTTON, || {
+                    View::button(ui, paste_text, Colors::button(), || {
                         self.tx_info_finalize_edit = cb.get_string_from_buffer();
                     });
                     // Callback on finalization message input change.
@@ -846,7 +846,7 @@ impl WalletTransactions {
                 columns[0].vertical_centered_justified(|ui| {
                     // Draw button to show Slatepack message as QR code.
                     let qr_text = format!("{} {}", QR_CODE, t!("qr_code"));
-                    View::button(ui, qr_text, Colors::BUTTON, || {
+                    View::button(ui, qr_text, Colors::button(), || {
                         cb.hide_keyboard();
                         self.tx_info_show_qr = true;
                     });
@@ -854,7 +854,7 @@ impl WalletTransactions {
                 columns[1].vertical_centered_justified(|ui| {
                     // Draw copy button.
                     let copy_text = format!("{} {}", COPY, t!("copy"));
-                    View::button(ui, copy_text, Colors::BUTTON, || {
+                    View::button(ui, copy_text, Colors::button(), || {
                         cb.copy_string_to_buffer(self.tx_info_response_edit.clone());
                         self.tx_info_finalize_edit = "".to_string();
                         if tx.can_finalize {
@@ -932,7 +932,7 @@ impl WalletTransactions {
             };
             ui.label(RichText::new(text)
                 .size(17.0)
-                .color(Colors::TEXT));
+                .color(Colors::text(false)));
             ui.add_space(8.0);
         });
 
@@ -943,13 +943,13 @@ impl WalletTransactions {
 
             ui.columns(2, |columns| {
                 columns[0].vertical_centered_justified(|ui| {
-                    View::button(ui, t!("modal.cancel"), Colors::WHITE, || {
+                    View::button(ui, t!("modal.cancel"), Colors::white_or_black(false), || {
                         self.confirm_cancel_tx_id = None;
                         modal.close();
                     });
                 });
                 columns[1].vertical_centered_justified(|ui| {
-                    View::button(ui, "OK".to_string(), Colors::WHITE, || {
+                    View::button(ui, "OK".to_string(), Colors::white_or_black(false), || {
                         wallet.cancel(self.confirm_cancel_tx_id.unwrap());
                         self.confirm_cancel_tx_id = None;
                         modal.close();

src/lib.rs

@@ -41,10 +41,10 @@ pub mod built_info {
     include!(concat!(env!("OUT_DIR"), "/built.rs"));
 }
 
+/// Android platform entry point.
 #[allow(dead_code)]
 #[cfg(target_os = "android")]
 #[no_mangle]
-/// Android platform entry point.
 fn android_main(app: AndroidApp) {
     #[cfg(debug_assertions)]
     {
@@ -59,6 +59,12 @@ fn android_main(app: AndroidApp) {
     let platform = Android::new(app.clone());
     use winit::platform::android::EventLoopBuilderExtAndroid;
 
+    // Setup system theme if not set.
+    if let None = AppConfig::dark_theme() {
+        let use_dark = system_dark_theme(&platform);
+        AppConfig::set_dark_theme(use_dark);
+    }
+
     let width = app.config().screen_width_dp().unwrap() as f32;
     let height = app.config().screen_height_dp().unwrap() as f32;
     let size = egui::emath::vec2(width, height);
@@ -82,7 +88,16 @@ fn android_main(app: AndroidApp) {
         builder.with_android_app(app);
     }));
 
-    start(options, app_creator(PlatformApp::new(platform)));
+    let app = PlatformApp::new(platform);
+    start(options, app_creator(app));
+}
+
+/// Check if system is using dark theme.
+#[allow(dead_code)]
+#[cfg(target_os = "android")]
+fn system_dark_theme(platform: &gui::platform::Android) -> bool {
+    let res = platform.call_java_method("useDarkTheme", "()Z", &[]).unwrap();
+    unsafe { res.z != 0 }
 }
 
 /// [`PlatformApp`] setup for [`eframe`].
@@ -132,17 +147,27 @@ pub fn setup_visuals(ctx: &Context) {
     // Setup style
     ctx.set_style(style);
 
-    let mut visuals = egui::Visuals::light();
+    // Setup visuals based on app color theme.
+    let use_dark = AppConfig::dark_theme().unwrap_or(false);
+    let mut visuals = if use_dark {
+        egui::Visuals::dark()
+    } else {
+        egui::Visuals::light()
+    };
     // Setup selection color.
-    visuals.selection.stroke = Stroke { width: 1.0, color: Colors::TEXT };
-    visuals.selection.bg_fill = Colors::GOLD;
+    visuals.selection.stroke = Stroke { width: 1.0, color: Colors::text(false) };
+    visuals.selection.bg_fill = Colors::gold();
     // Disable stroke around panels by default.
     visuals.widgets.noninteractive.bg_stroke = Stroke::NONE;
     // Setup stroke around inactive widgets.
-    visuals.widgets.inactive.bg_stroke = View::DEFAULT_STROKE;
+    visuals.widgets.inactive.bg_stroke = View::default_stroke();
     // Setup background and foreground stroke color for widgets like pull-to-refresher.
-    visuals.widgets.inactive.bg_fill = Colors::YELLOW;
-    visuals.widgets.inactive.fg_stroke.color = Colors::ITEM_BUTTON;
+    visuals.widgets.inactive.bg_fill = if use_dark {
+        Colors::white_or_black(false)
+    } else {
+        Colors::yellow()
+    };
+    visuals.widgets.inactive.fg_stroke.color = Colors::item_button();
     // Setup visuals
     ctx.set_visuals(visuals);
 }

src/main.rs

@@ -12,6 +12,8 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
+use dark_light::Mode;
+
 pub fn main() {
     #[allow(dead_code)]
     #[cfg(not(target_os = "android"))]
@@ -36,7 +38,17 @@ fn real_main() {
 
     let platform = Desktop::default();
 
-    // Desktop window size.
+    // Setup system theme if not set.
+    if let None = AppConfig::dark_theme() {
+        let dark = match dark_light::detect() {
+            Mode::Dark => true,
+            Mode::Light => false,
+            Mode::Default => false
+        };
+        AppConfig::set_dark_theme(dark);
+    }
+
+    // Setup window size.
     let (width, height) = AppConfig::window_size();
 
     let mut viewport = egui::ViewportBuilder::default()
@@ -53,7 +65,7 @@ fn real_main() {
         }));
     }
 
-    // Desktop window position.
+    // Setup window position.
     if let Some((x, y)) = AppConfig::window_pos() {
         viewport = viewport.with_position(pos2(x, y));
     }

src/settings/config.rs

@@ -44,7 +44,10 @@ pub struct AppConfig {
     x: Option<f32>, y: Option<f32>,
 
     /// Locale code for i18n.
-    lang: Option<String>
+    lang: Option<String>,
+
+    /// Flag to check if dark theme should be used, use system settings if not set.
+    use_dark_theme: Option<bool>,
 }
 
 impl Default for AppConfig {
@@ -60,6 +63,7 @@ impl Default for AppConfig {
             x: None,
             y: None,
             lang: None,
+            use_dark_theme: None,
         }
     }
 }
@@ -213,8 +217,21 @@ impl AppConfig {
 
     /// Mark integrated node warning for Android as shown.
     pub fn show_android_integrated_node_warning() {
-        let mut w_app_config = Settings::app_config_to_update();
-        w_app_config.android_integrated_node_warning = Some(false);
-        w_app_config.save();
+        let mut w_config = Settings::app_config_to_update();
+        w_config.android_integrated_node_warning = Some(false);
+        w_config.save();
+    }
+
+    /// Check if dark theme should be used.
+    pub fn dark_theme() -> Option<bool> {
+        let r_config = Settings::app_config_to_read();
+        r_config.use_dark_theme.clone()
+    }
+
+    /// Setup flag to use dark theme.
+    pub fn set_dark_theme(use_dark: bool) {
+        let mut w_config = Settings::app_config_to_update();
+        w_config.use_dark_theme = Some(use_dark);
+        w_config.save();
     }
 }