diff --git a/src/components/ThemeColor/index.js b/src/components/ThemeColor/index.js
index f57ecf2..55c1d0b 100644
--- a/src/components/ThemeColor/index.js
+++ b/src/components/ThemeColor/index.js
@@ -98,11 +98,11 @@ const ColorCard = ({ theme, text, dark, light, item, setItem }) => {
           />
         )}
       </div>
-      <div className="flex flex-row justify-around">
+      <div className="flex flex-row justify-between">
         {" "}
         {dark ? (
           <div
-            className={`flex-col cursor-pointer rounded-sm relative p-4 w-[160px] h-[75px] bg-${item}Dark ${
+            className={`flex-col cursor-pointer rounded-sm relative p-4 w-[165px] h-[75px] bg-${item}Dark ${
               text ? `text-${item}Text` : ""
             }`}
             onClick={() => setItem(item + "Dark")}
@@ -116,7 +116,7 @@ const ColorCard = ({ theme, text, dark, light, item, setItem }) => {
         ) : null}
         {light ? (
           <div
-            className={`flex flex-col cursor-pointer rounded-sm relative p-4 w-[160px] h-[75px]  bg-${item}Light ${
+            className={`flex flex-col cursor-pointer rounded-sm relative p-4 w-[165px] h-[75px]  bg-${item}Light ${
               text ? `text-${item}Text` : ""
             }`}
             onClick={() => setItem(item + "Light")}