From 5f9a1dee3b42aa27c2230872e8f3b5a8185c94c9 Mon Sep 17 00:00:00 2001
From: hax <140146906+emptyhax@users.noreply.github.com>
Date: Tue, 24 Jun 2025 15:47:13 -0300
Subject: [PATCH 1/2] Create system24-light.theme.css

---
 theme/system24-light.theme.css | 123 +++++++++++++++++++++++++++++++++
 1 file changed, 123 insertions(+)
 create mode 100644 theme/system24-light.theme.css

diff --git a/theme/system24-light.theme.css b/theme/system24-light.theme.css
new file mode 100644
index 0000000..72aa358
--- /dev/null
+++ b/theme/system24-light.theme.css
@@ -0,0 +1,123 @@
+
+/**
+ * @name System24 Light
+ * @description a tui-like discord theme (light version).
+ * @author refact0r
+ * @author (light) emptyhax
+ 
+ */
+ 
+@import url('https://refact0r.github.io/system24/build/system24.css');
+
+body {
+   
+    --font: 'DM Mono', monospace;
+    --code-font: 'DM Mono', monospace;
+    font-weight: 350;
+    letter-spacing: -0.03ch;
+    
+ 
+    --bg-1: oklch(98% 0 0);
+    --bg-2: oklch(95% 0 0);
+    --bg-3: oklch(92% 0.01 270);
+    --bg-4: oklch(90% 0.01 270);
+    
+    --text-1: oklch(15% 0 0);
+    --text-2: oklch(25% 0 0);
+    --text-3: oklch(35% 0 0);
+    
+    --border-light: oklch(85% 0.01 270);
+    --border-dark: oklch(80% 0.01 270);
+    
+    --hover: oklch(85% 0.02 270 / 0.15);
+    
+    /* Melhorias nas bordas e cantos */
+    --border-radius: 4px;
+    --avatar-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
+    --divider-thickness: 2px;
+    --border-thickness: 1px;
+    
+ 
+    --border-hover-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+    --list-item-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
+    
+ 
+    --accent-1: oklch(65% 0.08 290);
+    --accent-2: oklch(60% 0.08 290);
+    --accent-3: oklch(55% 0.08 290);
+}
+
+ 
+.avatar-1BDn8e, .avatar-3uk_u9, .avatar-2Vndt_ {
+    border-radius: var(--avatar-radius) !important;
+    transition: all 0.3s ease;
+    border: 2px solid var(--border-light);
+}
+
+.avatar-1BDn8e:hover, .avatar-3uk_u9:hover, .avatar-2Vndt_:hover {
+    border-radius: 40% 60% 60% 40% / 40% 40% 60% 60% !important;
+    transform: scale(1.05);
+}
+
+ 
+:root {
+    --dms-background-color: linear-gradient(
+        135deg, 
+        oklch(92% 0.05 230), 
+        oklch(92% 0.05 290), 
+        oklch(92% 0.05 350)
+    );
+}
+
+ 
+:root:not([data-unrounding="on"]) {
+    --border-radius: 6px;
+    
+    .container-2cd8Mz, .container-1oAagU, .sidebar-2K8pFh {
+        border-radius: var(--border-radius);
+        border: 1px solid var(--border-light);
+    }
+}
+
+/* Barra do Spotify mais discreta */
+.spotify-bar {
+    height: 2px;
+    background: linear-gradient(90deg, var(--accent-3), var(--accent-1));
+    border-radius: 1px;
+}
+ 
+.item-2GWPIy:hover {
+    background-color: color-mix(in oklch, var(--hover), transparent 70%);
+    transform: translateX(2px);
+}
+
+ 
+.theme-light {
+    --header-primary: var(--text-1);
+    --header-secondary: var(--text-2);
+    --text-normal: var(--text-1);
+    --text-muted: var(--text-3);
+    --interactive-normal: var(--text-2);
+    --interactive-hover: var(--text-1);
+    --interactive-active: var(--text-1);
+    --background-modifier-hover: var(--hover);
+    --background-modifier-active: color-mix(in oklch, var(--hover), transparent 50%);
+}
+ 
+.message-2CShn3 {
+    background-color: var(--bg-2);
+    border-left: 2px solid var(--border-light);
+}
+
+ 
+.button-1EGGcP {
+    background-color: var(--bg-3);
+    color: var(--text-1);
+    border: 1px solid var(--border-light);
+}
+
+.button-1EGGcP:hover {
+    background-color: var(--bg-4);
+}
+
+

From 0860d0aa96ff631bdec5bc9e56958a81d503686e Mon Sep 17 00:00:00 2001
From: hax <140146906+emptyhax@users.noreply.github.com>
Date: Tue, 24 Jun 2025 16:57:52 -0300
Subject: [PATCH 2/2] improved colors and scrollbars

---
 theme/system24-light.theme.css | 112 ++++++++++++++++++++++-----------
 1 file changed, 76 insertions(+), 36 deletions(-)

diff --git a/theme/system24-light.theme.css b/theme/system24-light.theme.css
index 72aa358..6e0d4e6 100644
--- a/theme/system24-light.theme.css
+++ b/theme/system24-light.theme.css
@@ -1,35 +1,35 @@
-
 /**
- * @name System24 Light
- * @description a tui-like discord theme (light version).
+ * @name System24 Light Enhanced Darker+ Purple
+ * @description Tema TUI-like com cores escuras e scrollbars roxas
  * @author refact0r
- * @author (light) emptyhax
- 
+ * @version 2.1.3
+ * @source https://github.com/refact0r/system24
  */
- 
+
+/* Importar módulos do tema */
 @import url('https://refact0r.github.io/system24/build/system24.css');
 
 body {
-   
+    /* Melhorias na tipografia */
     --font: 'DM Mono', monospace;
     --code-font: 'DM Mono', monospace;
     font-weight: 350;
     letter-spacing: -0.03ch;
     
- 
-    --bg-1: oklch(98% 0 0);
-    --bg-2: oklch(95% 0 0);
-    --bg-3: oklch(92% 0.01 270);
-    --bg-4: oklch(90% 0.01 270);
+    /* Esquema de cores claro - versão mais escura */
+    --bg-1: oklch(94% 0 0);
+    --bg-2: oklch(91% 0 0);
+    --bg-3: oklch(88% 0.01 270);
+    --bg-4: oklch(85% 0.01 270);
     
-    --text-1: oklch(15% 0 0);
-    --text-2: oklch(25% 0 0);
-    --text-3: oklch(35% 0 0);
+    --text-1: oklch(25% 0 0);
+    --text-2: oklch(35% 0 0);
+    --text-3: oklch(45% 0 0);
     
-    --border-light: oklch(85% 0.01 270);
-    --border-dark: oklch(80% 0.01 270);
+    --border-light: oklch(80% 0.01 270);
+    --border-dark: oklch(75% 0.01 270);
     
-    --hover: oklch(85% 0.02 270 / 0.15);
+    --hover: oklch(80% 0.02 270 / 0.15);
     
     /* Melhorias nas bordas e cantos */
     --border-radius: 4px;
@@ -37,17 +37,17 @@ body {
     --divider-thickness: 2px;
     --border-thickness: 1px;
     
- 
+    /* Transições suavizadas */
     --border-hover-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
     --list-item-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
     
- 
-    --accent-1: oklch(65% 0.08 290);
-    --accent-2: oklch(60% 0.08 290);
-    --accent-3: oklch(55% 0.08 290);
+    /* Cores de destaque mais escuras */
+    --accent-1: oklch(55% 0.08 290);
+    --accent-2: oklch(50% 0.08 290);
+    --accent-3: oklch(45% 0.08 290);
 }
 
- 
+/* Aplicar bordas orgânicas aos avatares */
 .avatar-1BDn8e, .avatar-3uk_u9, .avatar-2Vndt_ {
     border-radius: var(--avatar-radius) !important;
     transition: all 0.3s ease;
@@ -59,17 +59,17 @@ body {
     transform: scale(1.05);
 }
 
- 
+/* Degradê mais escuro para o DM */
 :root {
     --dms-background-color: linear-gradient(
         135deg, 
-        oklch(92% 0.05 230), 
-        oklch(92% 0.05 290), 
-        oklch(92% 0.05 350)
+        oklch(88% 0.05 230), 
+        oklch(88% 0.05 290), 
+        oklch(88% 0.05 350)
     );
 }
 
- 
+/* Suavizar bordas dos painéis */
 :root:not([data-unrounding="on"]) {
     --border-radius: 6px;
     
@@ -79,19 +79,20 @@ body {
     }
 }
 
-/* Barra do Spotify mais discreta */
+/* Barra do Spotify mais contrastante */
 .spotify-bar {
     height: 2px;
     background: linear-gradient(90deg, var(--accent-3), var(--accent-1));
     border-radius: 1px;
 }
- 
+
+/* Efeito de hover mais visível */
 .item-2GWPIy:hover {
-    background-color: color-mix(in oklch, var(--hover), transparent 70%);
+    background-color: color-mix(in oklch, var(--hover), transparent 60%);
     transform: translateX(2px);
 }
 
- 
+/* Ajustes para elementos específicos no modo claro */
 .theme-light {
     --header-primary: var(--text-1);
     --header-secondary: var(--text-2);
@@ -101,15 +102,16 @@ body {
     --interactive-hover: var(--text-1);
     --interactive-active: var(--text-1);
     --background-modifier-hover: var(--hover);
-    --background-modifier-active: color-mix(in oklch, var(--hover), transparent 50%);
+    --background-modifier-active: color-mix(in oklch, var(--hover), transparent 40%);
 }
- 
+
+/* Melhor contraste para mensagens */
 .message-2CShn3 {
     background-color: var(--bg-2);
     border-left: 2px solid var(--border-light);
 }
 
- 
+/* Botões com mais contraste */
 .button-1EGGcP {
     background-color: var(--bg-3);
     color: var(--text-1);
@@ -118,6 +120,44 @@ body {
 
 .button-1EGGcP:hover {
     background-color: var(--bg-4);
+    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
 }
 
+/* ==================== */
+/* SCROLLBARS ROXAS */
+/* ==================== */
 
+::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+}
+
+::-webkit-scrollbar-track {
+    background: var(--bg-2);
+    border-radius: 5px;
+}
+
+::-webkit-scrollbar-thumb {
+    background: oklch(60% 0.12 290);
+    border-radius: 5px;
+    border: 2px solid var(--bg-2);
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: oklch(55% 0.15 290);
+}
+
+::-webkit-scrollbar-corner {
+    background: var(--bg-2);
+}
+
+/* Firefox */
+* {
+    scrollbar-width: thin;
+    scrollbar-color: oklch(60% 0.12 290) var(--bg-2);
+}
+
+/* Ajuste para a barra lateral */
+.sidebar-2K8pFh::-webkit-scrollbar-thumb {
+    background: oklch(55% 0.15 290);
+}