diff --git a/src/components/ThemeColor/ColorCard.js b/src/components/ThemeColor/ColorCard.js
index b3f1813..32692ba 100644
--- a/src/components/ThemeColor/ColorCard.js
+++ b/src/components/ThemeColor/ColorCard.js
@@ -18,7 +18,7 @@ const ColorCard = ({
         } ${borderColor ? ` border border-${item}Border` : ""} `}
         onClick={() => setItem(item)}
       >
-        <ItemColor className=" text-2xl font-bold" item={item} theme={theme} />
+        <ItemColor className="text-2xl font-bold" item={item} theme={theme} />
         <div className="flex flex-row items-center justify-between mt-5 ">
           {text && (
             <ItemColor
diff --git a/src/components/ThemeColor/default.js b/src/components/ThemeColor/default.js
index 694c090..0290ab7 100644
--- a/src/components/ThemeColor/default.js
+++ b/src/components/ThemeColor/default.js
@@ -13,14 +13,14 @@ const defaultTheme = {
   surfaceText: "#000000",
   surfaceBorder: "#FF08AD",
   info: "#43c1ff",
-  infoMessageText: "#000000",
+  infoText: "#000000",
   success: "#42b258",
-  successMessageText: "#000000",
+  successText: "#000000",
   warning: "#ffa200",
-  warningMessageText: "#000000",
+  warningText: "#000000",
   error: "#ff4600",
-  errorMessageText: "#000000",
+  errorText: "#000000",
 };
 const classNames =
-  "bg-primary text-primaryText bg-secondary text-secondaryText bg-primaryDark  bg-primaryLight  text-primaryDark text-primaryLight bg-primaryDark  bg-secondaryLight  text-secondaryDark text-secondaryLight bg-secondaryDark  text-secondaryDark bg-background text-backgroundText bg-surface text-surfaceText border-surfaceBorder bg-info text-infoMessageText bg-success text-successMessageText bg-warning text-warningMessageText bg-error text-errorMessageText";
+  "bg-primary text-primaryText bg-secondary text-secondaryText bg-primaryDark  bg-primaryLight  text-primaryDark text-primaryLight bg-primaryDark  bg-secondaryLight  text-secondaryDark text-secondaryLight bg-secondaryDark  text-secondaryDark bg-background text-backgroundText bg-surface text-surfaceText border-surfaceBorder bg-info text-infoText bg-success text-successText bg-warning text-warningText bg-error text-errorText";
 export default defaultTheme;
diff --git a/tailwind.config.js b/tailwind.config.js
index 16d831b..03064f1 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -26,15 +26,16 @@ module.exports = {
       surfaceText: "var(--theme-surfaceText)",
       surfaceBorder: "var(--theme-surfaceBorder)",
       info: "var(--theme-info)",
-      infoMessageText: "var(--theme-infoMessageText)",
+      infoText: "var(--theme-infoText)",
       success: "var(--theme-success)",
-      successMessageText: "var(--theme-successMessageText)",
+      successText: "var(--theme-successText)",
       warning: "var(--theme-warning)",
-      warningMessageText: "var(--theme-warningMessageText)",
+      warningText: "var(--theme-warningText)",
       error: "var(--theme-error)",
-      errorMessageText: "var(--theme-errorMessageText)",
+      errorText: "var(--theme-errorText)",
     },
   },
+
   plugins: [
     require("@themesberg/flowbite/plugin"),
     require("tw-elements/dist/plugin"),