diff --git a/imports/Spectral/Component/MaterialIcon.qml b/imports/Spectral/Component/MaterialIcon.qml
index 35ee4a1..d0564c6 100644
--- a/imports/Spectral/Component/MaterialIcon.qml
+++ b/imports/Spectral/Component/MaterialIcon.qml
@@ -1,7 +1,6 @@
 import QtQuick 2.12
 import QtQuick.Controls 2.4
 import QtQuick.Layouts 1.3
-import QtQuick.Controls.Material 2.4
 
 import Spectral.Setting 0.1
 import Spectral.Font 0.1
@@ -11,7 +10,7 @@ Text {
 
     id: materialLabel
 
-    color: Material.foreground
+    color: MPalette.foreground
     font.pixelSize: 24
     font.family: MaterialFont.name
     horizontalAlignment: Text.AlignHCenter
diff --git a/imports/Spectral/Component/Timeline/MessageDelegate.qml b/imports/Spectral/Component/Timeline/MessageDelegate.qml
index 5b7ac4e..05499ae 100644
--- a/imports/Spectral/Component/Timeline/MessageDelegate.qml
+++ b/imports/Spectral/Component/Timeline/MessageDelegate.qml
@@ -58,7 +58,7 @@ ColumnLayout {
             visible: !(sentByMe || avatarVisible)
 
             text: Qt.formatDateTime(time, "hh:mm")
-            color: "#5B7480"
+            color: MPalette.lighter
 
             font.pixelSize: 10
             horizontalAlignment: Label.AlignHCenter
diff --git a/imports/Spectral/Component/Timeline/SectionDelegate.qml b/imports/Spectral/Component/Timeline/SectionDelegate.qml
index d022135..32400dc 100644
--- a/imports/Spectral/Component/Timeline/SectionDelegate.qml
+++ b/imports/Spectral/Component/Timeline/SectionDelegate.qml
@@ -1,8 +1,10 @@
 import QtQuick 2.12
 import QtQuick.Controls 2.4
+import Spectral.Setting 0.1
 
 Label {
     text: section + " • " + Qt.formatTime(time, "hh:mm")
+    color: MPalette.foreground
     font.pixelSize: 13
     font.weight: Font.Medium
     font.capitalization: Font.AllUppercase
diff --git a/imports/Spectral/Panel/RoomHeader.qml b/imports/Spectral/Panel/RoomHeader.qml
index eb291d5..4222787 100644
--- a/imports/Spectral/Panel/RoomHeader.qml
+++ b/imports/Spectral/Panel/RoomHeader.qml
@@ -6,6 +6,7 @@ import QtQuick.Controls.Material 2.4
 import Spectral 0.1
 import Spectral.Effect 2.0
 import Spectral.Component 2.0
+import Spectral.Setting 0.1
 
 Control {
     property alias avatar: headerImage.source
@@ -53,6 +54,7 @@ Control {
                 Layout.fillHeight: true
 
                 text: currentRoom ? currentRoom.displayName : ""
+                color: MPalette.foreground
                 font.pixelSize: 16
                 elide: Text.ElideRight
                 wrapMode: Text.NoWrap
@@ -64,7 +66,7 @@ Control {
 
                 id: headerTopicLabel
 
-                color: "#5B7480"
+                color: MPalette.lighter
                 elide: Text.ElideRight
                 wrapMode: Text.NoWrap
             }
diff --git a/imports/Spectral/Panel/RoomListPanel.qml b/imports/Spectral/Panel/RoomListPanel.qml
index 9a6cdb7..e0a3415 100644
--- a/imports/Spectral/Panel/RoomListPanel.qml
+++ b/imports/Spectral/Panel/RoomListPanel.qml
@@ -12,7 +12,7 @@ import Spectral.Setting 0.1
 
 import SortFilterProxyModel 0.2
 
-Rectangle {
+Item {
     property var controller: null
     readonly property var user: controller.connection ? controller.connection.localUser : null
 
@@ -25,8 +25,6 @@ Rectangle {
 
     id: root
 
-    color: MSettings.darkTheme ? "#303030" : "#FFFFFF"
-
     RoomListModel {
         id: roomListModel
 
@@ -638,6 +636,7 @@ Rectangle {
                     topPadding: 0
                     bottomPadding: 0
                     placeholderText: "Search..."
+                    color: MPalette.lighter
 
                     background: Item {}
                 }
@@ -779,6 +778,7 @@ Rectangle {
                             Layout.fillHeight: true
 
                             text: name || "No Name"
+                            color: MPalette.foreground
                             font.pixelSize: 16
                             elide: Text.ElideRight
                             wrapMode: Text.NoWrap
@@ -789,7 +789,7 @@ Rectangle {
                             Layout.fillHeight: true
 
                             text: (lastEvent == "" ? topic : lastEvent).replace(/(\r\n\t|\n|\r\t)/gm,"")
-                            color: "#5B7480"
+                            color: MPalette.lighter
                             font.pixelSize: 13
                             elide: Text.ElideRight
                             wrapMode: Text.NoWrap
@@ -855,7 +855,7 @@ Rectangle {
                 height: 24
 
                 text: section
-                color: "#5B7480"
+                color: MPalette.lighter
                 leftPadding: 16
                 elide: Text.ElideRight
                 verticalAlignment: Text.AlignVCenter
@@ -894,7 +894,7 @@ Rectangle {
             }
 
             Button {
-                text: "Reject"
+                text: "Cancel"
                 flat: true
 
                 onClicked: inviteDialog.close()
diff --git a/imports/Spectral/Setting/Palette.qml b/imports/Spectral/Setting/Palette.qml
new file mode 100644
index 0000000..3b040ff
--- /dev/null
+++ b/imports/Spectral/Setting/Palette.qml
@@ -0,0 +1,13 @@
+pragma Singleton
+import QtQuick 2.12
+import QtQuick.Controls.Material 2.3
+
+QtObject {
+    readonly property int theme: MSettings.darkTheme ? Material.Dark : Material.Light
+
+    readonly property color primary: "#344955"
+    readonly property color accent: "#673AB7"
+    readonly property color foreground: MSettings.darkTheme ? "#FFFFFF" : "#1D333E"
+    readonly property color background: MSettings.darkTheme ? "#303030" : "#FFFFFF"
+    readonly property color lighter: MSettings.darkTheme ? "#FFFFFF" : "#5B7480"
+}
diff --git a/imports/Spectral/Setting/qmldir b/imports/Spectral/Setting/qmldir
index 5e1c2a7..2c923cd 100644
--- a/imports/Spectral/Setting/qmldir
+++ b/imports/Spectral/Setting/qmldir
@@ -1,3 +1,3 @@
 module Spectral.Setting
 singleton MSettings 0.1 Setting.qml
-
+singleton MPalette 0.1 Palette.qml
diff --git a/qml/main.qml b/qml/main.qml
index 9f4f93a..02862ec 100644
--- a/qml/main.qml
+++ b/qml/main.qml
@@ -14,7 +14,8 @@ import Spectral 0.1
 import Spectral.Setting 0.1
 
 ApplicationWindow {
-    Material.theme: MSettings.darkTheme ? Material.Dark : Material.Light
+    Material.theme: MPalette.theme
+    Material.background: MPalette.background
 
     width: 960
     height: 640
@@ -26,6 +27,10 @@ ApplicationWindow {
     visible: true
     title: qsTr("Spectral")
 
+    background: Rectangle {
+        color: MSettings.darkTheme ? "#303030" : "#FFFFFF"
+    }
+
     Platform.SystemTrayIcon {
         visible: MSettings.showTray
         iconSource: "qrc:/assets/img/icon.png"
diff --git a/qtquickcontrols2.conf b/qtquickcontrols2.conf
index de25d2b..6db2aaf 100644
--- a/qtquickcontrols2.conf
+++ b/qtquickcontrols2.conf
@@ -10,5 +10,4 @@ Theme=Light
 Variant=Dense
 Primary=#344955
 Accent=#673AB7
-Background=#FFFFFF
 Font/Family="Roboto,Noto Sans,Noto Color Emoji"
diff --git a/res.qrc b/res.qrc
index 78e1f6d..8f74d56 100644
--- a/res.qrc
+++ b/res.qrc
@@ -42,5 +42,6 @@
         <file>assets/img/roompanel-dark.svg</file>
         <file>imports/Spectral/Component/Timeline/ImageDelegate.qml</file>
         <file>imports/Spectral/Component/Avatar.qml</file>
+        <file>imports/Spectral/Setting/Palette.qml</file>
     </qresource>
 </RCC>