diff --git a/Tab.qml b/Tab.qml
deleted file mode 100644
index 2857a77..0000000
--- a/Tab.qml
+++ /dev/null
@@ -1,43 +0,0 @@
-import QtGraphicalEffects 1.0
-import QtQuick 2.7
-import QtQuick.Controls 2.4
-import QtQuick.Controls.Material 2.0
-import QtQuick.Layouts 1.3
-
-import "fonts/Twemoji.js" as T
-import "theme"
-import "fonts"
-import "." as Opaque
-
-Rectangle {
-    id: root
-
-    property bool active: false
-    property alias text: label.text
-
-    color: Theme.backgroundMainColor
-
-    signal clicked
-
-    height: label.height
-    property alias size: label.size
-
-
-    Opaque.ScalingLabel {
-        id: label
-        anchors.horizontalCenter: parent.horizontalCenter
-        color: root.active ? Theme.mainTextColor : Theme.altTextColor
-        size: Theme.tabSize
-
-        font.family: Fonts.applicationFontRegular.name
-        font.styleName: "Bold"
-    }
-
-    MouseArea {
-        anchors.fill: parent
-        onClicked: {
-            parent.focus = true
-            parent.clicked()
-        }
-    }
-}
diff --git a/TabBar.qml b/TabBar.qml
new file mode 100644
index 0000000..7f8cb44
--- /dev/null
+++ b/TabBar.qml
@@ -0,0 +1,44 @@
+import QtQuick 2.13
+import QtQuick.Controls 2.13
+
+import "../opaque/theme"
+
+// Tabs.qml
+//
+// Example 1:
+// Tabs {
+//   model: [qsTr("tab1-name"), qsTr("tab2-name"), qsTr("tab3-name")]
+//   onCurrentIndexChanged: {
+//     //...eg: loader.source = filenames[currentIndex]
+//   }
+// }
+ListView {
+	id: root
+
+	// properties
+	property color highlightColor: Theme.dividerColor
+
+	// contents & appearance config
+	model: ["your", "model", "here"]
+	delegate: Label {
+		// contents & appearance config
+		text: model.modelData
+		elide: Text.ElideRight
+		horizontalAlignment: Text.AlignHCenter
+		color: Theme.mainTextColor
+		font.pixelSize: Theme.chatMetaTextSize * gcd.themeScale
+		font.weight: Font.Bold
+
+		// functionality
+		MouseArea { anchors.fill: parent; onClicked: root.currentIndex = index; }
+		width: root.width / root.model.length
+	}
+	highlight: Rectangle { radius: 5; color: root.highlightColor; }
+
+	// functionality
+	height: Theme.secondaryTextSize * gcd.themeScale + 5
+	orientation: Qt.Horizontal
+	interactive: true
+	highlightFollowsCurrentItem: true
+	boundsBehavior: Flickable.StopAtBounds
+}
\ No newline at end of file