diff --git a/Editor/Qml/EButton.qml b/Editor/Qml/EButton.qml
index 810bd9448..0353c1a70 100644
--- a/Editor/Qml/EButton.qml
+++ b/Editor/Qml/EButton.qml
@@ -3,6 +3,29 @@ import QtQuick.Controls
 import QtQuick.Controls.Basic
 
 Button {
+    enum Style {
+        Primary,
+        Secondary,
+        Disabled,
+        Outline,
+        Dashed
+    }
+
+    function getBackgroundColor(style, focus)
+    {
+        if (style === EButton.Style.Secondary) {
+            return focus ? ETheme.secondaryFocusColor : ETheme.secondaryColor;
+        } else if (style === EButton.Style.Disabled) {
+            return ETheme.disabledColor;
+        }
+        // TODO more
+        return focus ? ETheme.primaryFocusColor : ETheme.primaryColor;
+    }
+
+    property int style: EButton.Style.Primary
+
+    // TODO disable onclick when disabled
+
     contentItem: Text {
         text: parent.text
         font.pixelSize: ETheme.contentFontSize
@@ -15,7 +38,7 @@ Button {
 
     background: Rectangle {
         implicitWidth: 50
-        color: parent.down ? ETheme.focusColor : ETheme.primaryColor
+        color: getBackgroundColor(style, parent.down)
         radius: 10
     }
 }
diff --git a/Editor/Qml/ETheme.qml b/Editor/Qml/ETheme.qml
index ab3f73d83..f6f6f6540 100644
--- a/Editor/Qml/ETheme.qml
+++ b/Editor/Qml/ETheme.qml
@@ -5,8 +5,10 @@ import QtQuick
 QtObject {
     property color bgColor: Qt.color('#212121')
     property color primaryColor: Qt.color('#e74c3c')
-    property color focusColor: Qt.color('#c0392b')
-    property color secondaryColor: Qt.color('#f1c40f')
+    property color primaryFocusColor: Qt.color('#c0392b')
+    property color secondaryColor: Qt.color('#d58845')
+    property color secondaryFocusColor: Qt.color('#9b6a40')
+    property color disabledColor: Qt.color('#676563')
     property color fontColor: Qt.color('#ecf0f1')
 
     property FontLoader normalFont: FontLoader { source: Qt.url('Resource/Font/MiSans-Normal.ttf') }
diff --git a/Editor/Qml/EWidgetSamples.qml b/Editor/Qml/EWidgetSamples.qml
index bd899e4d8..206f7888b 100644
--- a/Editor/Qml/EWidgetSamples.qml
+++ b/Editor/Qml/EWidgetSamples.qml
@@ -29,36 +29,16 @@ Rectangle {
                 }
 
                 EButton {
-                    text: 'TODO Secondary Button'
+                    style: EButton.Style.Secondary
+                    text: 'Secondary Button'
                 }
 
                 EButton {
-                    text: 'TODO Disabled Button'
+                    style: EButton.Style.Disabled
+                    text: 'Disabled Button'
                 }
 
-                EButton {
-                    text: 'TODO Icon Button'
-                }
-
-                EButton {
-                    text: 'TODO Outline Button'
-                }
-            }
-
-            RowLayout {
-                Layout.margins: 5
-
-                EButton {
-                    text: 'TODO Dashed Button'
-                }
-
-                EButton {
-                    text: 'TODO Dashed Button'
-                }
-
-                EButton {
-                    text: 'TODO Text Button'
-                }
+                // TODO icon button
             }
 
             RowLayout {
@@ -93,6 +73,9 @@ Rectangle {
                     text: 'Content'
                     style: EText.Style.Content
                 }
+
+                // TODO superlink text
+                // TODO button text
             }
         }
     }