diff --git a/spec/theme-manager-spec.coffee b/spec/theme-manager-spec.coffee
index d9d9cd45b..e4823c204 100644
--- a/spec/theme-manager-spec.coffee
+++ b/spec/theme-manager-spec.coffee
@@ -39,8 +39,8 @@ describe "ThemeManager", ->
 
       config.set('core.themes', ['atom-light-syntax', 'atom-dark-syntax'])
       expect($('style.theme').length).toBe 2
-      expect($('style.theme:eq(0)').attr('id')).toMatch /atom-light-syntax/
-      expect($('style.theme:eq(1)').attr('id')).toMatch /atom-dark-syntax/
+      expect($('style.theme:eq(0)').attr('id')).toMatch /atom-dark-syntax/
+      expect($('style.theme:eq(1)').attr('id')).toMatch /atom-light-syntax/
 
       config.set('core.themes', [])
       expect($('style.theme').length).toBe 0
diff --git a/src/theme-manager.coffee b/src/theme-manager.coffee
index 070b063cb..be3f39808 100644
--- a/src/theme-manager.coffee
+++ b/src/theme-manager.coffee
@@ -39,6 +39,11 @@ class ThemeManager
     config.observe 'core.themes', (themeNames) =>
       @unload()
       themeNames = [themeNames] unless _.isArray(themeNames)
+
+      # Reverse so the first (top) theme is loaded after the others. We want
+      # the first/top theme to override later themes in the stack.
+      (themeNames = _.clone(themeNames)).reverse()
+
       @activateTheme(themeName) for themeName in themeNames
       @loadUserStylesheet()