diff --git a/Components/Tabs.qml b/Components/Tabs.qml
new file mode 100644
index 0000000..01bf897
--- /dev/null
+++ b/Components/Tabs.qml
@@ -0,0 +1,77 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+import QtQuick.Layouts 1.15
+import qs.Settings
+
+Item {
+    id: root
+    property var tabsModel: [] // [{icon: "videocam", label: "Video"}, ...]
+    property int currentIndex: 0
+    signal tabChanged(int index)
+
+    RowLayout {
+        id: tabBar
+        anchors.horizontalCenter: parent.horizontalCenter
+        spacing: 16
+
+        Repeater {
+            model: root.tabsModel
+            delegate: Column {
+                width: 56
+                spacing: 2
+                property bool hovered: false
+
+                MouseArea {
+                    anchors.fill: parent
+                    onClicked: {
+                        if (root.currentIndex !== index) {
+                            root.currentIndex = index;
+                            root.tabChanged(index);
+                        }
+                    }
+                    cursorShape: Qt.PointingHandCursor
+                    hoverEnabled: true
+                    onEntered: parent.hovered = true
+                    onExited: parent.hovered = false
+                }
+
+                // Icon
+                Text {
+                    text: modelData.icon
+                    font.family: "Material Icons"
+                    font.pixelSize: 22
+                    color: index === root.currentIndex
+                        ? (Theme ? Theme.accentPrimary : "#7C3AED")
+                        : parent.hovered
+                            ? (Theme ? Theme.accentPrimary : "#7C3AED")
+                            : (Theme ? Theme.textSecondary : "#444")
+                    anchors.horizontalCenter: parent.horizontalCenter
+                }
+
+                // Label
+                Text {
+                    text: modelData.label
+                    font.pixelSize: 12
+                    font.bold: index === root.currentIndex
+                    color: index === root.currentIndex
+                        ? (Theme ? Theme.accentPrimary : "#7C3AED")
+                        : parent.hovered
+                            ? (Theme ? Theme.accentPrimary : "#7C3AED")
+                            : (Theme ? Theme.textSecondary : "#444")
+                    anchors.horizontalCenter: parent.horizontalCenter
+                }
+
+                // Underline for active tab
+                Rectangle {
+                    width: 24
+                    height: 2
+                    radius: 1
+                    color: index === root.currentIndex
+                        ? (Theme ? Theme.accentPrimary : "#7C3AED")
+                        : "transparent"
+                    anchors.horizontalCenter: parent.horizontalCenter
+                }
+            }
+        }
+    }
+} 
\ No newline at end of file
diff --git a/Settings/Theme.json b/Settings/Theme.json
index 41c634a..14fe370 100644
--- a/Settings/Theme.json
+++ b/Settings/Theme.json
@@ -1,28 +1,28 @@
 {
-  "backgroundPrimary": "#0E0F10",
-  "backgroundSecondary": "#1A1B1C",
-  "backgroundTertiary": "#262728",
+  "backgroundPrimary": "#0F1012",
+  "backgroundSecondary": "#1B1C1E",
+  "backgroundTertiary": "#27282A",
   
-  "surface": "#212223",
-  "surfaceVariant": "#323334",
+  "surface": "#222325",
+  "surfaceVariant": "#333436",
   
-  "textPrimary": "#F0F1E0",
-  "textSecondary": "#D8D9CA",
-  "textDisabled": "#909186",
+  "textPrimary": "#DBF7F5",
+  "textSecondary": "#C5DEDD",
+  "textDisabled": "#839493",
   
-  "accentPrimary": "#A3A485",
-  "accentSecondary": "#B5B69D",
-  "accentTertiary": "#82836A",
+  "accentPrimary": "#5D9BEC",
+  "accentSecondary": "#7DAFF0",
+  "accentTertiary": "#4A7CBD",
   
-  "error": "#8C8FD4",
-  "warning": "#A5A9ED",
+  "error": "#D687D8",
+  "warning": "#DFA2E1",
   
-  "highlight": "#DDDEB8",
-  "rippleEffect": "#DDDEB8",
+  "highlight": "#9EC3F4",
+  "rippleEffect": "#6DA5EE",
   
-  "onAccent": "#0E0F10",
-  "outline": "#565758",
+  "onAccent": "#0F1012",
+  "outline": "#575859",
   
-  "shadow": "#0E0F10",
-  "overlay": "#0E0F10"
+  "shadow": "#0F1012",
+  "overlay": "#0F1012"
 }
diff --git a/Widgets/Sidebar/Config/SettingsModal.qml b/Widgets/Sidebar/Config/SettingsModal.qml
index d98af5e..09e99b3 100644
--- a/Widgets/Sidebar/Config/SettingsModal.qml
+++ b/Widgets/Sidebar/Config/SettingsModal.qml
@@ -5,6 +5,7 @@ import Quickshell
 import Quickshell.Wayland
 import qs.Settings
 import qs.Services
+import qs.Components
 
 PanelWindow {
     id: settingsModal
@@ -102,6 +103,17 @@ PanelWindow {
                 }
             }
 
+            // Tabs bar (moved here)
+            Tabs {
+                id: settingsTabs
+                Layout.fillWidth: true
+                tabsModel: [
+                    { icon: "cloud", label: "Weather" },
+                    { icon: "settings", label: "System" },
+                    { icon: "wallpaper", label: "Wallpaper" }
+                ]
+            }
+
             // Scrollable settings area
             Rectangle {
                 Layout.fillWidth: true
@@ -109,96 +121,112 @@ PanelWindow {
                 color: "transparent"
                 border.width: 0
                 radius: 20
+
                 Flickable {
                     id: flick
                     anchors.fill: parent
                     contentWidth: width
-                    contentHeight: column.implicitHeight
+                    contentHeight: tabContentLoader.item ? tabContentLoader.item.implicitHeight : 0
                     clip: true
-                    interactive: true
-                    boundsBehavior: Flickable.StopAtBounds
+
+                    Loader {
+                        id: tabContentLoader
+                        anchors.top: parent.top
+                        width: parent.width
+                        sourceComponent: settingsTabs.currentIndex === 0 ? weatherTab : settingsTabs.currentIndex === 1 ? systemTab : wallpaperTab
+                    }
+                }
+
+                Component {
+                    id: weatherTab
                     ColumnLayout {
-                        id: column
-                        width: flick.width
-                        spacing: 24
-                        // CollapsibleCategory sections here
-                        CollapsibleCategory {
-                            title: "Weather"
-                            expanded: false
-                            WeatherSettings {
-                                weatherCity: (typeof tempWeatherCity !== 'undefined' && tempWeatherCity !== null) ? tempWeatherCity : ""
-                                useFahrenheit: tempUseFahrenheit
-                                onCityChanged: function (city) {
-                                    tempWeatherCity = city;
-                                }
-                                onTemperatureUnitChanged: function (useFahrenheit) {
-                                    tempUseFahrenheit = useFahrenheit;
-                                }
+                        anchors.fill: parent
+                        WeatherSettings {
+                            Layout.fillWidth: true
+                            Layout.alignment: Qt.AlignTop
+                            anchors.margins: 16
+                            weatherCity: (typeof tempWeatherCity !== 'undefined' && tempWeatherCity !== null) ? tempWeatherCity : ""
+                            useFahrenheit: tempUseFahrenheit
+                            onCityChanged: function (city) {
+                                tempWeatherCity = city;
+                            }
+                            onTemperatureUnitChanged: function (useFahrenheit) {
+                                tempUseFahrenheit = useFahrenheit;
                             }
                         }
-                        CollapsibleCategory {
-                            title: "System"
-                            expanded: false
-                            ProfileSettings {
-                                showActiveWindowIcon: tempShowActiveWindowIcon
-                                onShowAWIconChanged: function (showActiveWindowIcon) {
-                                    tempShowActiveWindowIcon = showActiveWindowIcon;
-                                }
-                                showSystemInfoInBar: tempShowSystemInfoInBar
-                                onShowSystemInfoChanged: function (showSystemInfoInBar) {
-                                    tempShowSystemInfoInBar = showSystemInfoInBar;
-                                }
-                                showMediaInBar: tempShowMediaInBar
-                                onShowMediaChanged: function (showMediaInBar) {
-                                    tempShowMediaInBar = showMediaInBar;
-                                }
-                                visualizerType: tempVisualizerType
-                                onVisualizerTypeUpdated: function (type) {
-                                    tempVisualizerType = type;
-                                }
+                    }
+                }
+                Component {
+                    id: systemTab
+                    ColumnLayout {
+                        anchors.fill: parent
+                        ProfileSettings {
+                            Layout.fillWidth: true
+                            Layout.alignment: Qt.AlignTop
+                            anchors.margins: 16
+                            showActiveWindowIcon: tempShowActiveWindowIcon
+                            onShowAWIconChanged: function (showActiveWindowIcon) {
+                                tempShowActiveWindowIcon = showActiveWindowIcon;
+                            }
+                            showSystemInfoInBar: tempShowSystemInfoInBar
+                            onShowSystemInfoChanged: function (showSystemInfoInBar) {
+                                tempShowSystemInfoInBar = showSystemInfoInBar;
+                            }
+                            showMediaInBar: tempShowMediaInBar
+                            onShowMediaChanged: function (showMediaInBar) {
+                                tempShowMediaInBar = showMediaInBar;
+                            }
+                            visualizerType: tempVisualizerType
+                            onVisualizerTypeUpdated: function (type) {
+                                tempVisualizerType = type;
                             }
                         }
-                        CollapsibleCategory {
-                            title: "Wallpaper"
-                            expanded: false
-                            WallpaperSettings {
-                                id: wallpaperSettings
-                                wallpaperFolder: (typeof tempWallpaperFolder !== 'undefined' && tempWallpaperFolder !== null) ? tempWallpaperFolder : ""
-                                useSWWW: tempUseSWWW
-                                randomWallpaper: tempRandomWallpaper
-                                useWallpaperTheme: tempUseWallpaperTheme
-                                wallpaperInterval: tempWallpaperInterval
-                                wallpaperResize: tempWallpaperResize
-                                transitionFps: tempTransitionFps
-                                transitionType: tempTransitionType
-                                transitionDuration: tempTransitionDuration
-                                onWallpaperFolderEdited: function (folder) {
-                                    tempWallpaperFolder = folder;
-                                }
-                                onUseSWWWChangedUpdated: function(useSWWW) {
-                                    tempUseSWWW = useSWWW;
-                                }
-                                onRandomWallpaperChangedUpdated: function(randomWallpaper) {
-                                    tempRandomWallpaper = randomWallpaper;
-                                }
-                                onUseWallpaperThemeChangedUpdated: function(useWallpaperTheme) {
-                                    tempUseWallpaperTheme = useWallpaperTheme;
-                                }
-                                onWallpaperIntervalChangedUpdated: function(wallpaperInterval) {
-                                    tempWallpaperInterval = wallpaperInterval;
-                                }
-                                onWallpaperResizeChangedUpdated: function(resize) {
-                                    tempWallpaperResize = resize;
-                                }
-                                onTransitionFpsChangedUpdated: function(fps) {
-                                    tempTransitionFps = fps;
-                                }
-                                onTransitionTypeChangedUpdated: function(type) {
-                                    tempTransitionType = type;
-                                }
-                                onTransitionDurationChangedUpdated: function(duration) {
-                                    tempTransitionDuration = duration;
-                                }
+                    }
+                }
+                Component {
+                    id: wallpaperTab
+                    ColumnLayout {
+                        anchors.fill: parent
+                        WallpaperSettings {
+                            id: wallpaperSettings
+                            Layout.fillWidth: true
+                            Layout.alignment: Qt.AlignTop
+                            anchors.margins: 16
+                            wallpaperFolder: (typeof tempWallpaperFolder !== 'undefined' && tempWallpaperFolder !== null) ? tempWallpaperFolder : ""
+                            useSWWW: tempUseSWWW
+                            randomWallpaper: tempRandomWallpaper
+                            useWallpaperTheme: tempUseWallpaperTheme
+                            wallpaperInterval: tempWallpaperInterval
+                            wallpaperResize: tempWallpaperResize
+                            transitionFps: tempTransitionFps
+                            transitionType: tempTransitionType
+                            transitionDuration: tempTransitionDuration
+                            onWallpaperFolderEdited: function (folder) {
+                                tempWallpaperFolder = folder;
+                            }
+                            onUseSWWWChangedUpdated: function(useSWWW) {
+                                tempUseSWWW = useSWWW;
+                            }
+                            onRandomWallpaperChangedUpdated: function(randomWallpaper) {
+                                tempRandomWallpaper = randomWallpaper;
+                            }
+                            onUseWallpaperThemeChangedUpdated: function(useWallpaperTheme) {
+                                tempUseWallpaperTheme = useWallpaperTheme;
+                            }
+                            onWallpaperIntervalChangedUpdated: function(wallpaperInterval) {
+                                tempWallpaperInterval = wallpaperInterval;
+                            }
+                            onWallpaperResizeChangedUpdated: function(resize) {
+                                tempWallpaperResize = resize;
+                            }
+                            onTransitionFpsChangedUpdated: function(fps) {
+                                tempTransitionFps = fps;
+                            }
+                            onTransitionTypeChangedUpdated: function(type) {
+                                tempTransitionType = type;
+                            }
+                            onTransitionDurationChangedUpdated: function(duration) {
+                                tempTransitionDuration = duration;
                             }
                         }
                     }
diff --git a/quickshell.conf b/quickshell.conf
new file mode 100644
index 0000000..01e622c
--- /dev/null
+++ b/quickshell.conf
@@ -0,0 +1,19 @@
+[quickshell]
+currentWallpaper=/home/lysec/nixos/assets/wallpapers/wallhaven-po8ow9.png
+profileImage=/home/lysec/.face
+randomWallpaperFlag=true
+showActiveWindowIconFlag=false
+showMediaInBarFlag=true
+showSystemInfoInBarFlag=true
+transitionDuration=1.1
+transitionFps=360
+transitionType=random
+useSWWWFlag=true
+useWallpaperThemeFlag=true
+videoPath=~/Videos/
+visualizerType=diamond
+wallpaperFolder=/home/lysec/nixos/assets/wallpapers
+wallpaperInterval=300
+wallpaperResize=crop
+weatherCity=Dinslaken
+weatherTempUnit=celsius