diff --git a/index.js b/index.js
index 1d0ec5ea..af0f6510 100644
--- a/index.js
+++ b/index.js
@@ -10,7 +10,7 @@ window.onerror = function(error, url) {
                     warning.style.margin = '16px';
                     document.body.appendChild(warning);
                 }
-                logo.src = 'source/Ox.UI/themes/classic/png/logo128.png';
+                logo.src = 'source/Ox.UI/themes/oxlight/png/logo128.png';
                 document.body.style.backgroundColor = 'rgb(224, 224, 224)';
                 document.body.style.color = 'rgb(64, 64, 64)';
                 document.body.style.fontFamily = [
@@ -68,6 +68,7 @@ Ox.load(/^https?:\/\/(www\.)?oxjs\.org\//.test(
         data: {
             downloads: {},
             html: {},
+            legacyThemes: {classic: 'oxlight', modern: 'oxdark'},
             pages: [
                 {id: 'about', title: 'About'},
                 {id: 'readme', title: 'Readme'},
@@ -80,7 +81,7 @@ Ox.load(/^https?:\/\/(www\.)?oxjs\.org\//.test(
                 item: {doc: '', examples: '', readme: ''},
                 page: '',
                 previousPage: 'about',
-                theme: 'classic'
+                theme: 'oxlight'
             },
             warning: 'Aw, snap! This website requires an up-to-date, '
                 + 'HTML5-compliant web browser. '
@@ -167,6 +168,8 @@ Ox.load(/^https?:\/\/(www\.)?oxjs\.org\//.test(
         },
         init: function() {
             app.user = Ox.extend(app.data.user, app.db());
+            app.user.theme = app.data.legacyThemes[app.user.theme]
+                || app.user.theme;
             app.loadScreen(function() {
                 app.loadData(function() {
                     Ox.load('UI', {theme: app.user.theme}, app.load);
@@ -636,8 +639,9 @@ Ox.load(/^https?:\/\/(www\.)?oxjs\.org\//.test(
                 return app.patchButtonGroup(
                     Ox.ButtonGroup({
                         buttons: [
-                            {id: 'classic', title: 'Light'},
-                            {id: 'modern', title: 'Dark'}
+                            {id: 'oxlight', title: 'Light'},
+                            {id: 'oxmedium', title: 'Medium'},
+                            {id: 'oxdark', title: 'Dark'}
                         ],
                         selectable: true,
                         value: app.user.theme