diff --git a/assets/themes.css b/assets/themes.css
new file mode 100644
index 0000000..23e1327
--- /dev/null
+++ b/assets/themes.css
@@ -0,0 +1,132 @@
+.theme-red {
+    --theme-main: #F44336;
+    --theme-text: white;
+    --theme-input: #E57373;
+    --theme-link: #01579b;
+}
+
+.theme-pink {
+    --theme-main: #E91E63;
+    --theme-text: white;
+    --theme-input: #F06292;
+    --theme-link: #01579b;
+}
+
+.theme-purple {
+    --theme-main: #9C27B0;
+    --theme-text: white;
+    --theme-input: #BA68C8;
+    --theme-link: #01579b;
+}
+
+.theme-deep-purple {
+    --theme-main: #673AB7;
+    --theme-text: white;
+    --theme-input: #9575CD;
+    --theme-link: #01579b;
+}
+
+.theme-indigo {
+    --theme-main: #3F51B5;
+    --theme-text: white;
+    --theme-input: #7986CB;
+    --theme-link: #01579b;
+}
+
+.theme-blue {
+    --theme-main: #2196F3;
+    --theme-text: white;
+    --theme-input: #64B5F6;
+    --theme-link: #01579b;
+}
+
+.theme-light-blue {
+    --theme-main: #03A9F4;
+    --theme-text: white;
+    --theme-input: #4FC3F7;
+    --theme-link: #01579b;
+}
+
+.theme-cyan {
+    --theme-main: #00BCD4;
+    --theme-text: white;
+    --theme-input: #4DD0E1;
+    --theme-link: #01579b;
+}
+
+.theme-teal {
+    --theme-main: #009688;
+    --theme-text: white;
+    --theme-input: #4DB6AC;
+    --theme-link: #01579b;
+}
+
+.theme-green {
+    --theme-main: #4CAF50;
+    --theme-text: white;
+    --theme-input: #81C784;
+    --theme-link: #01579b;
+}
+
+.theme-light-green {
+    --theme-main: #8BC34A;
+    --theme-text: white;
+    --theme-input: #AED581;
+    --theme-link: #01579b;
+}
+
+.theme-lime {
+    --theme-main: #CDDC39;
+    --theme-text: white;
+    --theme-input: #DCE775;
+    --theme-link: #01579b;
+}
+
+.theme-yellow {
+    --theme-main: #FBC02D;
+    --theme-text: white;
+    --theme-input: #FFEB3B;
+    --theme-link: #01579b;
+}
+
+.theme-amber {
+    --theme-main: #FFC107;
+    --theme-text: white;
+    --theme-input: #FFD54F;
+    --theme-link: #01579b;
+}
+
+.theme-orange {
+    --theme-main: #FF9800;
+    --theme-text: white;
+    --theme-input: #FFB74D;
+    --theme-link: #01579b;
+}
+
+.theme-deep-orange {
+    --theme-main: #FF5722;
+    --theme-text: white;
+    --theme-input: #FF8A65;
+    --theme-link: #01579b;
+}
+
+.theme-brown {
+    --theme-main: #795548;
+    --theme-text: white;
+    --theme-input: #A1887F;
+    --theme-link: #01579b;
+}
+
+.theme-gray {
+    --theme-main: #616161;
+    --theme-text: white;
+    --theme-input: #9E9E9E;
+    --theme-link: #01579b;
+}
+
+.theme-blue-gray {
+    --theme-main: #607D8B;
+    --theme-text: white;
+    --theme-input: #90A4AE;
+    --theme-link: #01579b;
+}
diff --git a/src/assets.rs b/src/assets.rs
index 91375c9..fd12279 100644
--- a/src/assets.rs
+++ b/src/assets.rs
@@ -1,6 +1,12 @@
 use futures::Future;
 use web::{Resource, ResponseFuture};
 
+// The CSS should be built to a single CSS file at compile time
+#[derive(StaticResource)]
+#[filename = "assets/themes.css"]
+#[mime = "text/css"]
+pub struct ThemesCss;
+
 #[derive(StaticResource)]
 #[filename = "assets/style.css"]
 #[mime = "text/css"]
diff --git a/src/wiki_lookup.rs b/src/wiki_lookup.rs
index 6212b6e..ae004c2 100644
--- a/src/wiki_lookup.rs
+++ b/src/wiki_lookup.rs
@@ -17,6 +17,10 @@ type ResourceFn = Box<Fn() -> BoxResource + Sync + Send>;
 
 lazy_static! {
     static ref ASSETS_MAP: HashMap<String, ResourceFn> = hashmap!{
+        // The CSS should be built to a single CSS file at compile time
+        "themes.css".into() =>
+            Box::new(|| Box::new(ThemesCss) as BoxResource) as ResourceFn,
+
         format!("style-{}.css", StyleCss::checksum()) =>
             Box::new(|| Box::new(StyleCss) as BoxResource) as ResourceFn,