diff --git a/routes/_static/themes.js b/routes/_static/themes.js
index 7c41b78..4149fa5 100644
--- a/routes/_static/themes.js
+++ b/routes/_static/themes.js
@@ -30,6 +30,10 @@ const themes = [
   {
     name: 'ozark',
     label: 'Ozark'
+  },
+  {
+    name: 'cobalt',
+    label: 'Cobalt'
   }
 ]
 
diff --git a/scss/themes/_offline.scss b/scss/themes/_offline.scss
index 5b01068..7827229 100644
--- a/scss/themes/_offline.scss
+++ b/scss/themes/_offline.scss
@@ -19,6 +19,7 @@ body.theme-oaken.offline,
 body.theme-scarlet.offline,
 body.theme-seafoam.offline,
 body.theme-gecko.offline,
-body.theme-ozark.offline {
+body.theme-ozark.offline,
+body.theme-cobalt.offline {
   @include baseTheme();
 }
diff --git a/scss/themes/cobalt.scss b/scss/themes/cobalt.scss
new file mode 100644
index 0000000..bc7379a
--- /dev/null
+++ b/scss/themes/cobalt.scss
@@ -0,0 +1,35 @@
+$main-theme-color: #08439b;
+$body-bg-color: #05285c;
+$anchor-color: #eeae00;
+$main-text-color: #e0e0e0;
+$main-bg-color: #08439b;
+$border-color: lighten($main-bg-color, 16%);
+$secondary-text-color: darken($main-text-color, 20%);
+$toast-border: #fafafa;
+$toast-bg: #333;
+$focus-outline: lighten($main-bg-color, 16%);
+$compose-background: lighten($main-theme-color, 32%);
+
+@import "_base.scss";
+@import "_dark.scss";
+
+body.theme-cobalt {
+  @include baseTheme();
+  @include darkTheme();
+
+  --settings-list-item-text: $main-text-color;
+  --settings-list-item-text-hover: $main-text-color;
+  
+  --action-button-fill-color-pressed: $anchor-color;
+  --action-button-fill-color-pressed-hover: darken($anchor-color, 2%);
+  --action-button-fill-color-pressed-active: darken($anchor-color, 15%);
+
+  --svg-fill: $secondary-text-color;
+
+  --nav-svg-fill: $main-text-color;
+  --nav-text-color: $main-text-color;
+  --nav-svg-fill-hover: $main-text-color;
+  --nav-text-color-hover: $main-text-color;  
+  --nav-a-selected-border: $anchor-color;
+  --nav-a-selected-border-hover: $anchor-color;
+} 
diff --git a/templates/2xx.html b/templates/2xx.html
index ab9e8a8..0cc6db7 100644
--- a/templates/2xx.html
+++ b/templates/2xx.html
@@ -51,6 +51,7 @@ body.offline,body.theme-hotpants.offline,body.theme-majesty.offline,body.theme-o
       majesty:   "blueviolet",
       gecko:     "#4ab92f",
       ozark:     "#5263af",
+      cobalt:    "#08439b",
       offline:   "#999999"
     }
     if (localStorage.store_currentInstance && localStorage.store_instanceThemes) {
@@ -129,4 +130,4 @@ body.offline,body.theme-hotpants.offline,body.theme-majesty.offline,body.theme-o
        initialise the router -->
   <script src='%sapper.main%'></script>
 </body>
-</html>
\ No newline at end of file
+</html>