diff --git a/src/Tinter.js b/src/Tinter.js
index c35e65a21e..77af0859da 100644
--- a/src/Tinter.js
+++ b/src/Tinter.js
@@ -15,8 +15,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import UserSettingsStore from './UserSettingsStore';
-
 // FIXME: these vars should be bundled up and attached to
 // module.exports otherwise this will break when included by both
 // react-sdk and apps layered on top.
@@ -122,6 +120,10 @@ module.exports = {
         return keyRgb;
     },
 
+    getCurrentColors: function() {
+        return colors;
+    },
+
     tint: function(primaryColor, secondaryColor, tertiaryColor) {
         if (!cached) {
             this.calcCssFixups();
@@ -129,7 +131,6 @@ module.exports = {
         }
 
         if (!primaryColor) {
-            const theme = UserSettingsStore.getTheme();
             primaryColor = keyRgb[0];
             secondaryColor = keyRgb[1];
         }
@@ -191,6 +192,8 @@ module.exports = {
     calcCssFixups: function() {
         if (DEBUG) console.log("calcCssFixups start");
 
+        cssFixups.length = 0;
+
         // update keyRgb from the current theme CSS itself, if it defines it
         if (document.getElementById('mx_theme_accentColor')) {
             keyRgb[0] = window.getComputedStyle(
diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js
index 15a8d2f31a..6429ea1ce1 100644
--- a/src/components/structures/MatrixChat.js
+++ b/src/components/structures/MatrixChat.js
@@ -920,6 +920,8 @@ module.exports = React.createClass({
         styleElements[theme].disabled = false;
 
         Tinter.calcCssFixups();
+        const colors = Tinter.getCurrentColors();
+        Tinter.tint(colors[0], colors[1]);
 
         if (theme === 'dark') {
             // abuse the tinter to change all the SVG's #fff to #2d2d2d