diff --git a/web/src/tabs/SettingsTab.tsx b/web/src/tabs/SettingsTab.tsx
index d320cdb..b3342b0 100644
--- a/web/src/tabs/SettingsTab.tsx
+++ b/web/src/tabs/SettingsTab.tsx
@@ -166,7 +166,7 @@ export const SettingsTab = ({ botState }: SettingsTabProps) => {
                             <Input
                                 value={profile?.role || 'user'}
                                 disabled={true}
-                                style={{ background: 'rgba(255, 255, 255, 0.02)', color: '#888', fontStyle: 'italic' }}
+                                style={{ background: 'color-mix(in oklab, var(--foreground) 2%, transparent)', color: 'var(--muted-foreground)', fontStyle: 'italic' }}
                             />
                         </div>
 
@@ -180,7 +180,7 @@ export const SettingsTab = ({ botState }: SettingsTabProps) => {
                                     onChange={handleChange}
                                     disabled={!editing}
                                 />
-                                <span className="toggle-label" style={{ color: formData.trade_enable ? '#00ff88' : '#ff3366' }}>
+                                <span className="toggle-label" style={{ color: formData.trade_enable ? 'var(--bl-success)' : 'var(--bl-danger)' }}>
                                     {formData.trade_enable ? 'Enabled' : 'Disabled'}
                                 </span>
                             </div>