diff --git a/www/components/Nav/Annoucement.tsx b/www/components/Nav/Annoucement.tsx
index 0d34746f118..cec28365dac 100644
--- a/www/components/Nav/Annoucement.tsx
+++ b/www/components/Nav/Annoucement.tsx
@@ -17,13 +17,13 @@ const a: A = data
 const Annoucement = () => {
   if (!a.show) return null
   return (
-    <div className="bg-[#5865F2]">
+    <div className="bg-brand-700">
       <div className="flex items-center justify-center py-2 mx-auto space-x-2 text-sm lg:container lg:px-16 xl:px-20 md:text-base">
         <span className="text-white">{a.text}</span>
         <a
           href={a.link.url}
           target="_blank"
-          className="inline-flex items-center px-2 py-1 space-x-1 text-xs transition-colors rounded-lg text-[#5865F2] bg-white border border-transparent dark:hover:border-white dark:hover:bg-[#5865F2]"
+          className="inline-flex items-center px-2 py-1 space-x-1 text-xs transition-colors rounded-lg text-brand-800 bg-white border border-transparent dark:hover:border-white dark:hover:bg-brand-700"
         >
           <span>{a.link.text}</span>
           <IconArrowRight size="tiny" />