diff --git a/app/assets/stylesheets/black.scss b/app/assets/stylesheets/black.scss
new file mode 100644
index 00000000..edff8b5c
--- /dev/null
+++ b/app/assets/stylesheets/black.scss
@@ -0,0 +1,12 @@
+$gray-lighter: #EEE;
+$brand-primary: rgba(0, 0, 0, 0.75);
+$navbar-inverse-bg: $brand_primary;
+$navbar-inverse-color: $gray-lighter;
+$navbar-inverse-link-color: $gray-lighter;
+$link-color: #CC3334;
+$link-hover-color: #FFF;
+$link-bgcolor: $link-color;
+$box-tablink-color: unset;
+
+// Import all components
+@import 'manifest';
diff --git a/app/assets/stylesheets/legacy.scss b/app/assets/stylesheets/legacy.scss
index 0063c260..c3a8bf9c 100644
--- a/app/assets/stylesheets/legacy.scss
+++ b/app/assets/stylesheets/legacy.scss
@@ -75,11 +75,17 @@ p {
 }
 
 a, a:link, a:active, a:visited {
+    color: $link-color;
     text-decoration: none;
     padding-left: 1px;
     padding-right: 1px;
 }
 
+a:hover {
+    color: $link-hover-color;
+    background-color: $link-bgcolor;
+}
+
 h1 {
     font-size: 304%;
     font-weight: bold;
@@ -816,11 +822,11 @@ form {
 #todo_new_action_container, #project_new_project_container, #context_new_container, #recurring_new_container {
     width: 270px;
     padding: 5px 10px;
-    background-color: #3C6997;
-    color: lighten(#000, 93.5%);
+    background-color: $brand-primary;
+    color: $gray-lighter;
     border-radius: 5px;
     a {
-        color: lighten(#000, 85%);
+        color: $box-tablink-color;
     }
 }
 
diff --git a/app/assets/stylesheets/colors.scss b/app/assets/stylesheets/light_blue.scss
similarity index 54%
rename from app/assets/stylesheets/colors.scss
rename to app/assets/stylesheets/light_blue.scss
index cb24b296..ae2972c1 100644
--- a/app/assets/stylesheets/colors.scss
+++ b/app/assets/stylesheets/light_blue.scss
@@ -3,4 +3,10 @@ $brand-primary: #3C6997;
 $navbar-inverse-bg: $brand_primary;
 $navbar-inverse-color: $gray-lighter;
 $navbar-inverse-link-color: $gray-lighter;
+$link-color: unset;
+$link-hover-color: unset;
+$link-bgcolor: unset;
+$box-tablink-color: lighten(#000, 85%);
 
+// Import all components
+@import 'manifest';
diff --git a/app/assets/stylesheets/application.scss b/app/assets/stylesheets/manifest.scss
similarity index 98%
rename from app/assets/stylesheets/application.scss
rename to app/assets/stylesheets/manifest.scss
index b6981688..ce2e368d 100644
--- a/app/assets/stylesheets/application.scss
+++ b/app/assets/stylesheets/manifest.scss
@@ -28,8 +28,6 @@
 }
 
 .bootstrap {
-  @import "colors";
-
   @import "bootstrap-sprockets";
   @import "bootstrap";
   @import "tracks-logo";
diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb
index 9a010552..1f2d62ad 100644
--- a/app/controllers/application_controller.rb
+++ b/app/controllers/application_controller.rb
@@ -7,6 +7,7 @@ class ApplicationController < ActionController::Base
   protect_from_forgery with: :exception
 
   include LoginSystem
+  include Common
   helper_method :current_user, :prefs, :format_date
 
   layout proc{ |controller| controller.mobile? ? "mobile" : "application" }
@@ -16,6 +17,7 @@ class ApplicationController < ActionController::Base
   before_action :set_time_zone
   before_action :set_zindex_counter
   before_action :set_locale
+  before_action :set_theme
   append_before_action :set_group_view_by
   prepend_before_action :login_required
   prepend_before_action :enable_mobile_content_negotiation
diff --git a/app/controllers/login_controller.rb b/app/controllers/login_controller.rb
index 2ca0b1cb..e0a97b8d 100644
--- a/app/controllers/login_controller.rb
+++ b/app/controllers/login_controller.rb
@@ -1,10 +1,12 @@
 class LoginController < ApplicationController
+  include Common
 
   layout 'login'
   skip_before_action :set_session_expiration
   skip_before_action :login_required
   before_action :login_optional
   before_action :get_current_user
+  before_action :set_theme
 
   protect_from_forgery :except => [:check_expiry, :login]
 
diff --git a/app/controllers/preferences_controller.rb b/app/controllers/preferences_controller.rb
index 3becc7d0..9e6db06d 100644
--- a/app/controllers/preferences_controller.rb
+++ b/app/controllers/preferences_controller.rb
@@ -40,7 +40,7 @@ private
       :staleness_starts, :due_style, :locale, :title_date_format, :time_zone,
       :show_hidden_projects_in_sidebar, :show_project_on_todo_done,
       :review_period, :refresh, :verbose_action_descriptors,
-      :mobile_todos_per_page, :sms_email, :sms_context_id)
+      :mobile_todos_per_page, :sms_email, :sms_context_id, :theme)
   end
 
   def user_params
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 16ff38f0..bdbb831f 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -1,5 +1,4 @@
 module ApplicationHelper
-
   def group_view_by_menu_entry
     # not set, no menu entry
     return "" if @group_view_by.nil?
diff --git a/app/models/preference.rb b/app/models/preference.rb
index df5e7d18..2666a13a 100644
--- a/app/models/preference.rb
+++ b/app/models/preference.rb
@@ -2,6 +2,10 @@ class Preference < ApplicationRecord
   belongs_to :user
   belongs_to :sms_context, :class_name => 'Context'
 
+  def self.themes
+    { :black => 'black', :light_blue => 'light_blue'}
+  end
+
   def self.due_styles
     { :due_in_n_days => 0, :due_on => 1}
   end
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 2c2e2b96..31e5808e 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -2,7 +2,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-    <%= stylesheet_link_tag "application", :media => "all" %>
+    <%= stylesheet_link_tag @user_theme, :media => "all" %>
     <%= stylesheet_link_tag "print", :media => "print" %>
     <%= javascript_include_tag "application" %>
     <%= csrf_meta_tags %>
diff --git a/app/views/layouts/login.html.erb b/app/views/layouts/login.html.erb
index 3e726051..ae1e43e7 100644
--- a/app/views/layouts/login.html.erb
+++ b/app/views/layouts/login.html.erb
@@ -6,7 +6,7 @@
     <%= favicon_link_tag 'favicon.ico' %>
     <%= favicon_link_tag 'apple-touch-icon.png', :rel => 'apple-touch-icon', :type => 'image/png' %>
     <title><%= @page_title -%></title>
-    <%= stylesheet_link_tag "application" %>
+    <%= stylesheet_link_tag @user_theme %>
   </head>
   <body class="bootstrap">
     <%= yield %>
diff --git a/app/views/preferences/_tracks_behavior.html.erb b/app/views/preferences/_tracks_behavior.html.erb
index a4efd17d..da5e5473 100644
--- a/app/views/preferences/_tracks_behavior.html.erb
+++ b/app/views/preferences/_tracks_behavior.html.erb
@@ -1,4 +1,3 @@
-
 <div class="form-group">
   <%= pref_with_select_field('prefs', "due_style", [[t('models.preference.due_styles')[0],Preference.due_styles[:due_in_n_days]],[t('models.preference.due_styles')[1],Preference.due_styles[:due_on]]]) %>
 </div>
@@ -38,3 +37,6 @@
 <div class="form-group">
   <%= pref('prefs', "sms_context") { select('prefs', 'sms_context_id', current_user.contexts.map{|c| [c.name, c.id]}, {}, class: "form-control") } %>
 </div>
+<div class="form-group">
+  <%= pref_with_select_field('prefs', 'theme', [[t('models.preference.themes.black'), Preference.themes[:black]], [t('models.preference.themes.light_blue'), Preference.themes[:light_blue]]]) %>
+</div>
diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb
index fdadc96a..117d2895 100644
--- a/config/initializers/assets.rb
+++ b/config/initializers/assets.rb
@@ -11,7 +11,4 @@ Rails.application.config.assets.paths << Rails.root.join('node_modules')
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in the app/assets
 # folder are already added.
-Rails.application.config.assets.precompile += %w( print.css mobile.css jquery-ui/datepicker-*.js swf_fu.js )
-
-# add /app/assets/swfs to asset pipeline for charts
-Rails.application.config.assets.paths << Rails.root.join("app", "assets", "swfs")
+Rails.application.config.assets.precompile += %w( light_blue.css black.css print.css mobile.css jquery-ui/datepicker-*.js )
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 663cbea6..7555540c 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -132,6 +132,9 @@ en:
       due_styles:
       - Due in ___ days
       - Due on _______
+      themes:
+        black: Black
+        light_blue: Light blue
   datetime:
     prompts:
       minute: Minute
diff --git a/config/site.yml.tmpl b/config/site.yml.tmpl
index 1d837be0..bd000214 100644
--- a/config/site.yml.tmpl
+++ b/config/site.yml.tmpl
@@ -2,17 +2,14 @@
 authentication_schemes:
   - "database"
 
-
 # You'll probably want to change this to the time zone of the computer where 
 # Tracks is running. Run rake time:zones:local have Rails suggest time zone 
 # names on your system
 time_zone: "UTC"
 
-
 # setting this to true will make the cookies only available over HTTPS
 secure_cookies: false
 
-
 # Your secret key for verifying the integrity of signed cookies.
 # If you change this key, all old signed cookies will become invalid!
 # Make sure the secret is at least 30 characters and all random,
@@ -32,22 +29,22 @@ force_ssl: false
 # address rather than the From: address.
 # email_dispatch: 'to'
 
-
 # If you want to send all email to a specific user, uncomment the following line 
 # and set the environment variable TRACKS_MAIL_RECEIVER to the login name of the 
 # user that will receive all email
 # email_dispatch: 'single_user'
 
-
 # Set this to the subdirectory you're hosting tracks in and uncomment if 
 # applicable. NOTE: you will also need to set up your web server to deal with 
 # the relative URL. Mongrel, for example, has a --prefix option.
 # subdir: "/tracks"
 
-
 # Set to true to allow anyone to sign up for a username.
 open_signups: false
 
+# Default theme and theme for the login form.
+# default_theme: light_blue
+
 # Set to require TOS approval on signup.
 #tos_link: "https://www.example.com"
 
@@ -64,7 +61,6 @@ open_signups: false
 # on the signup page
 admin_email: my.email@domain.com
 
-
 # Map of allowed incoming email addresses to real users
 # Requires email_dispatch == 'to'
 # This allows you to specify _who_ can send email Todos to your list
diff --git a/db/migrate/20200820000743_add_theme_to_preference.rb b/db/migrate/20200820000743_add_theme_to_preference.rb
new file mode 100644
index 00000000..0eed0a21
--- /dev/null
+++ b/db/migrate/20200820000743_add_theme_to_preference.rb
@@ -0,0 +1,5 @@
+class AddThemeToPreference < ActiveRecord::Migration[5.2]
+  def change
+    add_column :preferences, :theme, :string
+  end
+end
diff --git a/db/schema.rb b/db/schema.rb
index b0f92d33..a0b9a251 100644
--- a/db/schema.rb
+++ b/db/schema.rb
@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 2020_08_10_123316) do
+ActiveRecord::Schema.define(version: 2020_08_20_000743) do
 
   create_table "attachments", options: "ENGINE=InnoDB DEFAULT CHARSET=utf8", force: :cascade do |t|
     t.integer "todo_id"
@@ -87,6 +87,7 @@ ActiveRecord::Schema.define(version: 2020_08_10_123316) do
     t.integer "sms_context_id"
     t.string "locale"
     t.integer "review_period", default: 14, null: false
+    t.string "theme"
     t.index ["user_id"], name: "index_preferences_on_user_id"
   end
 
diff --git a/lib/common.rb b/lib/common.rb
new file mode 100644
index 00000000..240fa8f0
--- /dev/null
+++ b/lib/common.rb
@@ -0,0 +1,9 @@
+module Common
+  def set_theme
+    if prefs && prefs.theme
+      @user_theme = prefs.theme.parameterize.underscore
+    else
+      @user_theme = SITE_CONFIG['default_theme'] || 'light_blue'
+    end
+  end
+end