diff --git a/src/components/layout/Logo.tsx b/src/components/layout/Logo.tsx
index fa1bad8..6fd1428 100644
--- a/src/components/layout/Logo.tsx
+++ b/src/components/layout/Logo.tsx
@@ -4,10 +4,22 @@ import BrandIcon from './BrandIcon';
 
 const Logo = (props: { className?: string; isWhite?: boolean }) => {
   return (
-    <span className="flex items-center cursor-pointer gap-2">
-      <BrandIcon fill={props.isWhite ? 'white' : 'black'} />
+    <span className={clsx('flex items-center cursor-pointer gap-2')}>
+      <BrandIcon
+        fill={
+          process.env.NODE_ENV === 'development'
+            ? 'red'
+            : props.isWhite
+            ? 'white'
+            : 'black'
+        }
+      />
+
       <span
-        className={clsx(`text-xl font-[800] text-gray-900`, props.className)}
+        className={clsx(`text-xl font-[800] `, props.className, {
+          'text-red-600': process.env.NODE_ENV === 'development',
+          'text-gray-900': process.env.NODE_ENV !== 'development',
+        })}
       >
         digest.club
       </span>