diff --git a/packages/bruno-app/src/components/CollectionSettings/Vars/index.js b/packages/bruno-app/src/components/CollectionSettings/Vars/index.js
index d40854e41..8c7909309 100644
--- a/packages/bruno-app/src/components/CollectionSettings/Vars/index.js
+++ b/packages/bruno-app/src/components/CollectionSettings/Vars/index.js
@@ -14,11 +14,11 @@ const Vars = ({ collection }) => {
   return (
     <StyledWrapper className="w-full flex flex-col">
       <div className="flex-1 mt-2">
-        <div className="mb-1 title text-xs">Pre Request</div>
+        <div className="mb-3 title text-xs">Pre Request</div>
         <VarsTable collection={collection} vars={requestVars} varType="request" />
       </div>
       <div className="flex-1">
-        <div className="mt-1 mb-1 title text-xs">Post Response</div>
+        <div className="mt-3 mb-3 title text-xs">Post Response</div>
         <VarsTable collection={collection} vars={responseVars} varType="response" />
       </div>
       <div className="mt-6">
diff --git a/packages/bruno-app/src/components/EditableTable/StyledWrapper.js b/packages/bruno-app/src/components/EditableTable/StyledWrapper.js
index f8b962063..1d3b7f4a7 100644
--- a/packages/bruno-app/src/components/EditableTable/StyledWrapper.js
+++ b/packages/bruno-app/src/components/EditableTable/StyledWrapper.js
@@ -17,18 +17,18 @@ const StyledWrapper = styled.div`
     border-collapse: collapse;
     table-layout: fixed;
     font-size: ${(props) => props.theme.font.size.base};
+    font-weight: normal !important;
   }
 
   thead {
-    color: ${(props) => props.theme.colors.text} !important;
+    color: ${(props) => props.theme.table.thead.color} !important;
     background: ${(props) => props.theme.sidebar.bg};
-    font-size: ${(props) => props.theme.font.size.base};
     user-select: none;
 
     border: none !important;
 
     td {
-      padding: 8px 10px;
+      padding: 5px 10px !important;
       border-top: none !important;
       border-left: none !important;
       border-bottom: ${(props) => props.theme.workspace.environments.indentBorder};
@@ -55,7 +55,7 @@ const StyledWrapper = styled.div`
       }
 
       td {
-        padding: 2px 10px;
+        padding: 1px 10px !important;
         border-top: none !important;
         border-left: none !important;
         border-bottom: ${(props) => props.theme.workspace.environments.indentBorder};
@@ -93,7 +93,6 @@ const StyledWrapper = styled.div`
     background-color: transparent;
     color: ${(props) => props.theme.text};
     padding: 0;
-    font-size: 12px;
     border-radius: 4px;
     transition: all 0.15s ease;
 
@@ -106,7 +105,7 @@ const StyledWrapper = styled.div`
     cursor: pointer;
     width: 14px;
     height: 14px;
-    accent-color: ${(props) => props.theme.workspace.accent};
+    accent-color: ${(props) => props.theme.colors.accent};
     vertical-align: middle;
     margin: 0;
   }
diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js
index ed2257442..faf196a9d 100644
--- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js
+++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js
@@ -39,13 +39,13 @@ const Wrapper = styled.div`
     }
 
     thead {
-      color: ${(props) => props.theme.colors.text};
+      color: ${(props) => props.theme.table.thead.color} !important;
       background: ${(props) => props.theme.sidebar.bg};
       font-size: ${(props) => props.theme.font.size.base};
       user-select: none;
 
       td {
-        padding: 8px 10px;
+        padding: 5px 10px !important;
         border-bottom: ${(props) => props.theme.workspace.environments.indentBorder};
         border-right: ${(props) => props.theme.workspace.environments.indentBorder};
 
@@ -107,7 +107,6 @@ const Wrapper = styled.div`
     background-color: transparent;
     color: ${(props) => props.theme.text};
     padding: 0;
-    font-size: 12px;
     border-radius: 4px;
     transition: all 0.15s ease;
 
@@ -120,7 +119,7 @@ const Wrapper = styled.div`
     cursor: pointer;
     width: 14px;
     height: 14px;
-    accent-color: ${(props) => props.theme.workspace.accent};
+    accent-color: ${(props) => props.theme.colors.accent};
     vertical-align: middle;
     margin: 0;
   }
@@ -147,12 +146,11 @@ const Wrapper = styled.div`
   }
 
   .submit {
-    padding: 7px 16px;
-    font-size: 12px;
-    font-weight: 500;
-    border-radius: 6px;
+    padding: 6px 16px;
+    font-size: ${(props) => props.theme.font.size.sm};
+    border-radius: ${(props) => props.theme.border.radius.base};
     border: none;
-    background: ${(props) => props.theme.workspace.accent};
+    background: ${(props) => props.theme.brand};
     color: ${(props) => props.theme.bg};
     cursor: pointer;
     transition: opacity 0.15s ease;
@@ -165,18 +163,16 @@ const Wrapper = styled.div`
   .reset {
     background: transparent;
     padding: 6px 16px;
-    border: 1px solid ${(props) => props.theme.workspace.accent};
-    color: ${(props) => props.theme.workspace.accent};
+    color: ${(props) => props.theme.brand};
     &:hover {
       opacity: 0.9;
     }
   }
 
   .discard {
-    padding: 7px 16px;
-    font-size: 12px;
-    font-weight: 500;
-    border-radius: 6px;
+    padding: 6px 16px;
+    font-size: ${(props) => props.theme.font.size.sm};
+    border-radius: ${(props) => props.theme.border.radius.base};
     background: transparent;
     color: ${(props) => props.theme.text};
     border: ${(props) => props.theme.sidebar.collection.item.indentBorder};
diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/StyledWrapper.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/StyledWrapper.js
index 388236bce..f879a90d7 100644
--- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/StyledWrapper.js
+++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/EnvironmentDetails/StyledWrapper.js
@@ -16,8 +16,8 @@ const StyledWrapper = styled.div`
     flex-shrink: 0;
 
     .title {
-      font-size: 13px;
-      font-weight: 600;
+      font-size: ${(props) => props.theme.font.size.base};
+      font-weight: 500;
       color: ${(props) => props.theme.text};
       margin: 0;
     }
@@ -35,7 +35,7 @@ const StyledWrapper = styled.div`
           outline: none;
           color: ${(props) => props.theme.text};
           font-size: 15px;
-          font-weight: 600;
+          font-weight: 500;
           padding: 4px 8px;
           border-radius: 5px;
         }
diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js
index 750863fb3..0fa99802c 100644
--- a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js
+++ b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js
@@ -41,8 +41,8 @@ const StyledWrapper = styled.div`
     padding: 16px 16px 12px 16px;
     
     .title {
-      font-size: 13px;
-      font-weight: 600;
+      font-size: ${(props) => props.theme.font.size.base};
+      font-weight: 500;
       color: ${(props) => props.theme.text};
       margin: 0;
     }
diff --git a/packages/bruno-app/src/components/FolderSettings/Vars/index.js b/packages/bruno-app/src/components/FolderSettings/Vars/index.js
index 104d4ef41..8a75707ba 100644
--- a/packages/bruno-app/src/components/FolderSettings/Vars/index.js
+++ b/packages/bruno-app/src/components/FolderSettings/Vars/index.js
@@ -14,11 +14,11 @@ const Vars = ({ collection, folder }) => {
   return (
     <StyledWrapper className="w-full flex flex-col">
       <div className="flex-1 mt-2">
-        <div className="mb-1 title text-xs">Pre Request</div>
+        <div className="mb-3 title text-xs">Pre Request</div>
         <VarsTable folder={folder} collection={collection} vars={requestVars} varType="request" />
       </div>
       <div className="flex-1">
-        <div className="mt-1 mb-1 title text-xs">Post Response</div>
+        <div className="mt-3 mb-3 title text-xs">Post Response</div>
         <VarsTable folder={folder} collection={collection} vars={responseVars} varType="response" />
       </div>
       <div className="mt-6">
diff --git a/packages/bruno-app/src/components/ManageWorkspace/StyledWrapper.js b/packages/bruno-app/src/components/ManageWorkspace/StyledWrapper.js
index f049cc1f4..f9e80ca2e 100644
--- a/packages/bruno-app/src/components/ManageWorkspace/StyledWrapper.js
+++ b/packages/bruno-app/src/components/ManageWorkspace/StyledWrapper.js
@@ -40,7 +40,7 @@ const StyledWrapper = styled.div`
     gap: 6px;
     padding: 6px 12px;
     border-radius: ${(props) => props.theme.border.radius.base};
-    background: ${(props) => props.theme.workspace.accent};
+    background: ${(props) => props.theme.brand};
     color: white;
     font-size: ${(props) => props.theme.font.size.sm};
     font-weight: 500;
@@ -87,7 +87,7 @@ const StyledWrapper = styled.div`
     }
 
     &.regular {
-      color: ${(props) => props.theme.workspace.accent};
+      color: ${(props) => props.theme.brand};
     }
   }
 
diff --git a/packages/bruno-app/src/components/RequestPane/QueryParams/index.js b/packages/bruno-app/src/components/RequestPane/QueryParams/index.js
index 50ff9c03f..4dbc9a0dc 100644
--- a/packages/bruno-app/src/components/RequestPane/QueryParams/index.js
+++ b/packages/bruno-app/src/components/RequestPane/QueryParams/index.js
@@ -136,7 +136,7 @@ const QueryParams = ({ item, collection }) => {
   return (
     <StyledWrapper className="w-full flex flex-col">
       <div className="flex-1 mt-2">
-        <div className="mb-1 title text-xs">Query</div>
+        <div className="mb-3 title text-xs">Query</div>
         <EditableTable
           columns={queryColumns}
           rows={queryParams || []}
@@ -151,7 +151,7 @@ const QueryParams = ({ item, collection }) => {
           </button>
         </div>
 
-        <div className="mb-2 title text-xs flex items-stretch">
+        <div className="mb-3 title text-xs flex items-stretch">
           <span>Path</span>
           <InfoTip infotipId="path-param-InfoTip">
             <div>
diff --git a/packages/bruno-app/src/components/RequestPane/Vars/index.js b/packages/bruno-app/src/components/RequestPane/Vars/index.js
index eb292e9c2..292f5010e 100644
--- a/packages/bruno-app/src/components/RequestPane/Vars/index.js
+++ b/packages/bruno-app/src/components/RequestPane/Vars/index.js
@@ -10,11 +10,11 @@ const Vars = ({ item, collection }) => {
   return (
     <StyledWrapper className="w-full flex flex-col">
       <div className="mt-2">
-        <div className="mb-1 title text-xs">Pre Request</div>
+        <div className="mb-3 title text-xs">Pre Request</div>
         <VarsTable item={item} collection={collection} vars={requestVars} varType="request" />
       </div>
       <div>
-        <div className="mt-1 mb-1 title text-xs">Post Response</div>
+        <div className="mt-3 mb-3 title text-xs">Post Response</div>
         <VarsTable item={item} collection={collection} vars={responseVars} varType="response" />
       </div>
     </StyledWrapper>
diff --git a/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleHeaders/index.js b/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleHeaders/index.js
index 28a156d05..da5c8209d 100644
--- a/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleHeaders/index.js
+++ b/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleHeaders/index.js
@@ -130,7 +130,7 @@ const ResponseExampleHeaders = ({ editMode, item, collection, exampleUid }) => {
 
   return (
     <StyledWrapper className="w-full mt-4">
-      <div className="mb-1 title text-xs font-bold">Headers</div>
+      <div className="mb-3 title text-xs font-bold">Headers</div>
       <EditableTable
         columns={columns}
         rows={headers || []}
diff --git a/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleParams/index.js b/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleParams/index.js
index 4b550df28..a6518fb25 100644
--- a/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleParams/index.js
+++ b/packages/bruno-app/src/components/ResponseExample/ResponseExampleRequestPane/ResponseExampleParams/index.js
@@ -183,7 +183,7 @@ const ResponseExampleParams = ({ editMode, item, collection, exampleUid }) => {
 
   return (
     <StyledWrapper className="w-full mt-4">
-      <div className="mb-1 title text-xs font-bold">Query parameters</div>
+      <div className="mb-3 title text-xs font-bold">Query parameters</div>
       <EditableTable
         columns={queryColumns}
         rows={queryParams || []}
@@ -205,7 +205,7 @@ const ResponseExampleParams = ({ editMode, item, collection, exampleUid }) => {
       )}
       {pathParams && pathParams.length > 0 && (
         <>
-          <div className="mb-1 title text-xs font-bold flex items-stretch mt-4">
+          <div className="mb-3 title text-xs font-bold flex items-stretch mt-4">
             <span>Path parameters</span>
             <InfoTip infotipId="path-param-InfoTip">
               <div>
diff --git a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceDocs/StyledWrapper.js b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceDocs/StyledWrapper.js
index 29069de23..a024795df 100644
--- a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceDocs/StyledWrapper.js
+++ b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceDocs/StyledWrapper.js
@@ -120,7 +120,7 @@ const StyledWrapper = styled.div`
 
       &::before {
         content: '\\2022';
-        color: ${(props) => props.theme.workspace.accent};
+        color: ${(props) => props.theme.brand};
         margin-right: 6px;
       }
     }
@@ -129,8 +129,8 @@ const StyledWrapper = styled.div`
   .add-docs-btn {
     padding: 8px 16px;
     background: transparent;
-    color: ${(props) => props.theme.workspace.accent};
-    border: 1px solid ${(props) => props.theme.workspace.accent};
+    color: ${(props) => props.theme.brand};
+    border: 1px solid ${(props) => props.theme.brand};
     border-radius: ${(props) => props.theme.border.radius.base};
     font-size: ${(props) => props.theme.font.size.sm};
     font-weight: 500;
@@ -138,7 +138,7 @@ const StyledWrapper = styled.div`
     transition: all 0.15s ease;
 
     &:hover {
-      background: ${(props) => props.theme.workspace.accent}14;
+      background: ${(props) => props.theme.brand}10;
     }
   }
 `;
diff --git a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js
index 0953a8a9d..017b8c57f 100644
--- a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js
+++ b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/EnvironmentVariables/StyledWrapper.js
@@ -16,7 +16,6 @@ const Wrapper = styled.div`
     width: 100%;
     border-collapse: collapse;
     table-layout: fixed;
-    font-size: 12px;
 
     td {
       vertical-align: middle;
@@ -39,13 +38,13 @@ const Wrapper = styled.div`
     }
 
     thead {
-      color: ${(props) => props.theme.colors.text};
+      color: ${(props) => props.theme.table.thead.color} !important;
       background: ${(props) => props.theme.sidebar.bg};
       font-size: ${(props) => props.theme.font.size.base};
       user-select: none;
       
       td {
-        padding: 8px 10px;
+        padding: 5px 10px !important;
         border-bottom: ${(props) => props.theme.workspace.environments.indentBorder};
         border-right: ${(props) => props.theme.workspace.environments.indentBorder};
         
@@ -107,7 +106,6 @@ const Wrapper = styled.div`
     background-color: transparent;
     color: ${(props) => props.theme.text};
     padding: 0;
-    font-size: 12px;
     border-radius: 4px;
     transition: all 0.15s ease;
 
@@ -120,7 +118,7 @@ const Wrapper = styled.div`
     cursor: pointer;
     width: 14px;
     height: 14px;
-    accent-color: ${(props) => props.theme.workspace.accent};
+    accent-color: ${(props) => props.theme.colors.accent};
     vertical-align: middle;
     margin: 0;
   }
@@ -147,12 +145,11 @@ const Wrapper = styled.div`
   }
   
   .submit {
-    padding: 7px 16px;
-    font-size: 12px;
-    font-weight: 500;
-    border-radius: 6px;
+    padding: 6px 16px;
+    font-size: ${(props) => props.theme.font.size.sm};
+    border-radius: ${(props) => props.theme.border.radius.base};
     border: none;
-    background: ${(props) => props.theme.workspace.accent};
+    background: ${(props) => props.theme.brand};
     color: ${(props) => props.theme.bg};
     cursor: pointer;
     transition: opacity 0.15s ease;
@@ -165,18 +162,16 @@ const Wrapper = styled.div`
   .reset {
     background: transparent;
     padding: 6px 16px;
-    border: 1px solid ${(props) => props.theme.workspace.accent};
-    color: ${(props) => props.theme.workspace.accent};
+    color: ${(props) => props.theme.brand};
     &:hover {
       opacity: 0.9;
     }
   }
   
   .discard {
-    padding: 7px 16px;
-    font-size: 12px;
-    font-weight: 500;
-    border-radius: 6px;
+    padding: 6px 16px;
+    font-size: ${(props) => props.theme.font.size.sm};
+    border-radius: ${(props) => props.theme.border.radius.base};
     background: transparent;
     color: ${(props) => props.theme.text};
     border: ${(props) => props.theme.sidebar.collection.item.indentBorder};
diff --git a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/StyledWrapper.js b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/StyledWrapper.js
index 6cb5e3ed9..b41769191 100644
--- a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/StyledWrapper.js
+++ b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/EnvironmentDetails/StyledWrapper.js
@@ -16,8 +16,8 @@ const StyledWrapper = styled.div`
     flex-shrink: 0;
     
     .title {
-      font-size: 13px;
-      font-weight: 600;
+      font-size: ${(props) => props.theme.font.size.base};
+      font-weight: 500;
       color: ${(props) => props.theme.text};
       margin: 0;
     }
diff --git a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/StyledWrapper.js b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/StyledWrapper.js
index 750863fb3..0fa99802c 100644
--- a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/StyledWrapper.js
+++ b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceEnvironments/EnvironmentList/StyledWrapper.js
@@ -41,8 +41,8 @@ const StyledWrapper = styled.div`
     padding: 16px 16px 12px 16px;
     
     .title {
-      font-size: 13px;
-      font-weight: 600;
+      font-size: ${(props) => props.theme.font.size.base};
+      font-weight: 500;
       color: ${(props) => props.theme.text};
       margin: 0;
     }
diff --git a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceOverview/StyledWrapper.js b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceOverview/StyledWrapper.js
index f1b1dff6d..c0c677db2 100644
--- a/packages/bruno-app/src/components/WorkspaceHome/WorkspaceOverview/StyledWrapper.js
+++ b/packages/bruno-app/src/components/WorkspaceHome/WorkspaceOverview/StyledWrapper.js
@@ -67,17 +67,16 @@ const StyledWrapper = styled.div`
     align-items: center;
     gap: 5px;
     padding: 4px 8px;
-    border: 1px solid ${(props) => props.theme.workspace.accent};
+    border: 1px solid ${(props) => props.theme.brand};
     border-radius: ${(props) => props.theme.border.radius.base};
     background: transparent;
-    color: ${(props) => props.theme.workspace.accent};
+    color: ${(props) => props.theme.brand};
     font-size: ${(props) => props.theme.font.size.sm};
-    font-weight: 500;
     cursor: pointer;
     transition: all 0.15s ease;
 
     &:hover {
-      background: ${(props) => props.theme.workspace.accent}14;
+      background: ${(props) => props.theme.brand}10;
     }
   }
 
diff --git a/packages/bruno-app/src/themes/dark.js b/packages/bruno-app/src/themes/dark.js
index 95b886cb6..78744ae57 100644
--- a/packages/bruno-app/src/themes/dark.js
+++ b/packages/bruno-app/src/themes/dark.js
@@ -75,7 +75,8 @@ const darkTheme = {
     },
     bg: {
       danger: '#d03544'
-    }
+    },
+    accent: colors.BRAND
   },
 
   input: {
@@ -198,18 +199,18 @@ const darkTheme = {
 
   request: {
     methods: {
-      get: '#8cd656',
-      post: '#cd56d6',
-      put: '#d69956',
-      delete: '#f06f57',
-      // customize these colors if needed
-      patch: '#d69956',
-      options: '#d69956',
-      head: '#d69956'
+      get: '#5fbf7a', // Fresh jade — readable, calm success tone
+      post: '#b58adf', // Soft amethyst — cool, composed accent
+      put: '#d7a35a', // Warm amber-bronze — bridges BRAND + STRING
+      delete: '#e06c75', // VSCode red — destructive but readable
+      patch: '#d7a35a', // Same as PUT
+      options: '#c8b072', // Muted olive-gold — neutral method
+      head: '#9da5b4' // Cool gray-blue — subtle, low priority
     },
-    grpc: '#6366f1',
-    ws: '#d9a342',
-    gql: '#e535ab'
+
+    grpc: '#5fb3c4', // Steel cyan — technical, protocol-heavy, calm
+    ws: '#d9a342', // Brand gold — perfect as-is
+    gql: '#c96ab1' // Softened GraphQL pink — less neon, still iconic
   },
 
   requestTabPanel: {
diff --git a/packages/bruno-app/src/themes/light.js b/packages/bruno-app/src/themes/light.js
index 310479ca3..eb2909598 100644
--- a/packages/bruno-app/src/themes/light.js
+++ b/packages/bruno-app/src/themes/light.js
@@ -79,7 +79,8 @@ const lightTheme = {
     },
     bg: {
       danger: '#dc3545'
-    }
+    },
+    accent: '#b96f1d'
   },
 
   input: {
@@ -202,18 +203,18 @@ const lightTheme = {
 
   request: {
     methods: {
-      get: 'rgb(5, 150, 105)',
-      post: '#8e44ad',
-      put: '#ca7811',
-      delete: 'rgb(185, 28, 28)',
-      // customize these colors if needed
-      patch: '#ca7811',
-      options: '#ca7811',
-      head: '#ca7811'
+      get: '#3f8f7a', // Muted jade green (aligned with NUMBER / VARIABLE)
+      post: '#7c5aa8', // Soft plum (matches ATOM family)
+      put: '#b8742f', // Warm bronze (close to BRAND, slightly darker)
+      delete: '#a54b4b', // Muted brick red (fits KEYWORD ruby tone)
+      patch: '#b8742f', // Same as PUT (semantic consistency)
+      options: '#8a7a52', // Olive slate (neutral, non-invasive)
+      head: '#6b7a8f' // Slate blue (reuses OPERATOR tone)
     },
-    grpc: '#6366f1',
-    ws: '#f59e0b',
-    gql: '#e535ab'
+
+    grpc: '#5b65c8', // Muted indigo (technical, calm)
+    ws: '#c28a2c', // Golden bronze (pairs with BRAND without overpowering)
+    gql: '#b04a8f' // Dusty magenta (softened GraphQL pink)
   },
 
   requestTabPanel: {