diff --git a/src/components/articles/DisplayFAQs.tsx b/src/components/articles/DisplayFAQs.tsx
index 060d5789..2ebbab9f 100644
--- a/src/components/articles/DisplayFAQs.tsx
+++ b/src/components/articles/DisplayFAQs.tsx
@@ -20,9 +20,9 @@ const DisplayFAQs: React.FC<DisplayFAQsProps> = ({ faqs }) => {
 
   return (
     <div className="space-y-4 rounded-lg bg-white-secondary p-6 shadow-md res-text-sm">
-      <h2 className="mb-4 font-bold text-gray-900 res-text-xl">Frequently Asked Questions</h2>
+      <h2 className="text-text-900 mb-4 font-bold res-text-xl">Frequently Asked Questions</h2>
       {faqs.length === 0 && (
-        <p className="my-4 text-gray-700">No FAQs are added by the author yet.</p>
+        <p className="text-text-700 my-4">No FAQs are added by the author yet.</p>
       )}
       {faqs.map((faq, index) => (
         <div
@@ -35,21 +35,21 @@ const DisplayFAQs: React.FC<DisplayFAQsProps> = ({ faqs }) => {
           >
             <div className="flex items-center justify-between">
               <div className="flex items-center space-x-2">
-                <div className="font-semibold text-gray-900 res-text-base">Q{index + 1}:</div>
-                <p className="text-gray-700">{faq.question}</p>
+                <div className="text-text-900 font-semibold res-text-base">Q{index + 1}:</div>
+                <p className="text-text-700">{faq.question}</p>
               </div>
               {openIndex === index ? (
-                <ChevronUp className="text-gray-500" />
+                <ChevronUp className="text-text-500" />
               ) : (
-                <ChevronDown className="text-gray-500" />
+                <ChevronDown className="text-text-500" />
               )}
             </div>
           </button>
           {openIndex === index && (
             <div className="px-4 pb-4">
               <div className="flex items-start space-x-2 border-t border-gray-200 pt-2">
-                <div className="mt-0.5 font-medium text-gray-800 res-text-sm">A{index + 1}:</div>
-                <p className="text-gray-600">{faq.answer}</p>
+                <div className="text-text-800 mt-0.5 font-medium res-text-sm">A{index + 1}:</div>
+                <p className="text-text-600">{faq.answer}</p>
               </div>
             </div>
           )}
diff --git a/src/components/articles/SubmitArticleForm.tsx b/src/components/articles/SubmitArticleForm.tsx
index 21e38916..c5342ac6 100644
--- a/src/components/articles/SubmitArticleForm.tsx
+++ b/src/components/articles/SubmitArticleForm.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 
-
 import {
   Control,
   Controller,
@@ -244,7 +243,7 @@ const SubmitArticleForm: React.FC<SubmitArticleFormProps> = ({
               {showPrivateCheckOption && (
                 <div className="flex items-center gap-2">
                   <Checkbox
-                    onCheckedChange={(checked) => onChange(checked ? 'Private' : 'Public')}
+                    onCheckedChange={(checked: boolean) => onChange(checked ? 'Private' : 'Public')}
                     checked={value === 'Private'}
                   />
                   <span className="text-sm text-text-secondary">
diff --git a/src/components/posts/PostCard.tsx b/src/components/posts/PostCard.tsx
index 33c097ca..ea17a17a 100644
--- a/src/components/posts/PostCard.tsx
+++ b/src/components/posts/PostCard.tsx
@@ -62,7 +62,7 @@ const PostCard = (post: PostOut) => {
               height={36}
             />
             <div className="flex items-center">
-              <h3 className="font-semibold text-gray-900 res-text-sm">{post.author.username}</h3>
+              <h3 className="font-semibold text-primary res-text-sm">{post.author.username}</h3>
               <span className="mx-2 text-gray-400">&middot;</span>
               <p className="text-gray-400">{dayjs(post?.created_at).fromNow()}</p>
             </div>