diff --git a/src/components/structures/TagPanel.js b/src/components/structures/TagPanel.js
index 4bfebc59b8..7a187e4298 100644
--- a/src/components/structures/TagPanel.js
+++ b/src/components/structures/TagPanel.js
@@ -101,6 +101,7 @@ const TagPanel = React.createClass({
         const GroupsButton = sdk.getComponent('elements.GroupsButton');
         const DNDTagTile = sdk.getComponent('elements.DNDTagTile');
         const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
+        const TintableSvg = sdk.getComponent('elements.TintableSvg');
 
         const tags = this.state.orderedTags.map((tag, index) => {
             return <DNDTagTile
@@ -112,12 +113,10 @@ const TagPanel = React.createClass({
         });
 
         const clearButton = this.state.selectedTags.length > 0 ?
-            <img
-                src="img/icons-close.svg"
+            <TintableSvg src="img/icons-close.svg" width="24" height="24"
                 alt={_t("Clear filter")}
                 title={_t("Clear filter")}
-                width="24"
-                height="24" /> :
+            /> :
             <div />;
 
         return <div className="mx_TagPanel">