diff --git a/components/hackathons/hackathonBanner.tsx b/components/hackathons/hackathonBanner.tsx
index b12b4e377..32d05071b 100644
--- a/components/hackathons/hackathonBanner.tsx
+++ b/components/hackathons/hackathonBanner.tsx
@@ -4,10 +4,11 @@ import { Card } from '@/components/ui/card';
 import { Badge } from '@/components/ui/badge';
 import { formatDate } from '@/lib/utils';
 import { useEffect, useState } from 'react';
+import { sanitizeHtml } from '@/lib/utils/renderHtml';
 
 interface HackathonBannerProps {
   title: string;
-  subtitle?: string;
+  subtitle?: string | React.ReactNode;
   imageUrl?: string;
   deadline?: string;
   startDate?: string;
@@ -244,11 +245,17 @@ export function HackathonBanner({
             <h1 className='text-left text-3xl leading-tight font-bold text-white drop-shadow-lg md:text-4xl lg:text-5xl'>
               {title}
             </h1>
-            {subtitle && (
-              <p className='max-w-2xl text-left text-base text-gray-200 drop-shadow-md md:text-lg'>
-                {subtitle.slice(3)}
-              </p>
+            {subtitle && typeof subtitle === 'string' ? (
+              <div
+                className='max-w-2xl text-left text-base text-gray-200 drop-shadow-md md:text-lg'
+                dangerouslySetInnerHTML={sanitizeHtml(subtitle)}
+              />
+            ) : (
+              <div className='max-w-2xl text-left text-base text-gray-200 drop-shadow-md md:text-lg'>
+                {subtitle}
+              </div>
             )}
+
             {subtitle && (
               <div className='h-1 w-20 rounded-full bg-[#a7f950] md:w-24' />
             )}
diff --git a/components/wallet/WalletButton.tsx b/components/wallet/WalletButton.tsx
index 9e68aa430..e81068e9b 100644
--- a/components/wallet/WalletButton.tsx
+++ b/components/wallet/WalletButton.tsx
@@ -115,7 +115,7 @@ export const WalletButton = () => {
   return (
     <Button
       onClick={handleConnect}
-      className='flex items-center gap-2 bg-blue-500 text-white hover:bg-blue-600 dark:bg-blue-600 dark:hover:bg-blue-700'
+      className='bg-primary hover:bg-primary/60 flex items-center gap-2 text-black dark:bg-blue-600 dark:hover:bg-blue-700'
     >
       <Wallet className='h-4 w-4' />
       Connect Wallet
diff --git a/lib/utils/renderHtml.ts b/lib/utils/renderHtml.ts
new file mode 100644
index 000000000..fb435bc63
--- /dev/null
+++ b/lib/utils/renderHtml.ts
@@ -0,0 +1,50 @@
+import DOMPurify from 'dompurify';
+
+export function sanitizeHtml(html: string | undefined | null) {
+  const dirty = html ?? '';
+
+  try {
+    const clean = DOMPurify.sanitize(dirty, {
+      ALLOWED_TAGS: [
+        'b',
+        'i',
+        'em',
+        'strong',
+        'a',
+        'p',
+        'ul',
+        'ol',
+        'li',
+        'br',
+        'span',
+        'div',
+        'h1',
+        'h2',
+        'h3',
+        'h4',
+        'h5',
+        'img',
+        'code',
+        'pre',
+        'blockquote',
+        'small',
+        'sup',
+        'sub',
+      ],
+      ALLOWED_ATTR: [
+        'href',
+        'target',
+        'rel',
+        'class',
+        'id',
+        'title',
+        'alt',
+        'src',
+      ],
+    });
+    return { __html: clean };
+  } catch (err) {
+    console.error(err);
+    return { __html: dirty };
+  }
+}
diff --git a/package-lock.json b/package-lock.json
index f9ae116d9..86df2310a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -79,6 +79,7 @@
         "clsx": "^2.1.1",
         "cmdk": "^1.1.1",
         "date-fns": "^4.1.0",
+        "dompurify": "^3.3.0",
         "embla-carousel-autoplay": "^8.6.0",
         "embla-carousel-react": "^8.6.0",
         "framer-motion": "^12.23.12",
@@ -9545,6 +9546,15 @@
         "csstype": "^3.0.2"
       }
     },
+    "node_modules/dompurify": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.3.0.tgz",
+      "integrity": "sha512-r+f6MYR1gGN1eJv0TVQbhA7if/U7P87cdPl3HN5rikqaBSBxLiCb/b9O+2eG0cxz0ghyU+mU1QkbsOwERMYlWQ==",
+      "license": "(MPL-2.0 OR Apache-2.0)",
+      "optionalDependencies": {
+        "@types/trusted-types": "^2.0.7"
+      }
+    },
     "node_modules/draco3d": {
       "version": "1.5.7",
       "resolved": "https://registry.npmjs.org/draco3d/-/draco3d-1.5.7.tgz",
diff --git a/package.json b/package.json
index ecbcc600a..4573f3c9e 100644
--- a/package.json
+++ b/package.json
@@ -94,6 +94,7 @@
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "date-fns": "^4.1.0",
+    "dompurify": "^3.3.0",
     "embla-carousel-autoplay": "^8.6.0",
     "embla-carousel-react": "^8.6.0",
     "framer-motion": "^12.23.12",