diff --git a/Frontend/src/components/mock/HeadersComponent.vue b/Frontend/src/components/mock/HeadersComponent.vue
index 75f3be8..4b09e44 100644
--- a/Frontend/src/components/mock/HeadersComponent.vue
+++ b/Frontend/src/components/mock/HeadersComponent.vue
@@ -60,8 +60,8 @@ function addNewHeader(name : string, value : string){
             <div class="w-52 px-4"></div>
         </div>  
         <div class="flex flex-row gap-4" v-for="(item, index) in headerData" :key="index">
-            <input type="text" :value="index" class="text-field text-slate-400" disabled/>
-            <input type="text" :value="item" class="text-field text-slate-400" disabled/>
+            <input type="text" :value="index" class="text-field" disabled/>
+            <input type="text" :value="item" class="text-field" disabled/>
             <button @click="deleteHeader(index)" class="w-56" :class="setEssentialHeaderStyle(index)">Remove</button>
         </div>
         <div class="flex flex-row gap-4">
diff --git a/Frontend/src/style.css b/Frontend/src/style.css
index ba8b3b1..2133826 100644
--- a/Frontend/src/style.css
+++ b/Frontend/src/style.css
@@ -3,11 +3,11 @@
 @tailwind utilities;
 
 .inactive-button {
-    @apply py-2.5 px-4 h-fit text-slate-400 border border-slate-400 rounded-full
+    @apply py-2 px-4 h-fit text-slate-400 border border-slate-400 rounded-full
 }
 
 .tool-button {
-    @apply hover:brightness-110 py-2.5 px-4 h-fit rounded-full bg-gradient-to-r from-blue-400 to-sky-300  dark:text-white dark:from-sky-600 dark:to-sky-800 hover:bg-blue-400
+    @apply hover:brightness-110 py-2 px-4 h-fit rounded-full bg-gradient-to-r from-blue-400 to-sky-300  dark:text-white dark:from-sky-600 dark:to-sky-800 hover:bg-blue-400
 }
 
 .text-field {