diff --git a/themes/Fukasawa/components/AsideLeft.js b/themes/Fukasawa/components/AsideLeft.js
index 3f1047d7..116e5244 100644
--- a/themes/Fukasawa/components/AsideLeft.js
+++ b/themes/Fukasawa/components/AsideLeft.js
@@ -9,7 +9,7 @@ import Catalog from './Catalog'
 
 function AsideLeft (props) {
   const { tags, currentTag, categories, currentCategory, post } = props
-  return <div className='w-72 bg-white min-h-screen px-10 py-14 hidden lg:block'>
+  return <div className='w-72 bg-white dark:bg-gray-800 min-h-screen px-10 py-14 hidden lg:block'>
     <Logo />
 
     <section className='flex flex-col text-gray-600'>
@@ -22,8 +22,8 @@ function AsideLeft (props) {
       <SearchInput {...props}/>
     </section>
 
-    <section className='flex flex-col'>
-      <hr className='w-12 my-8 ' />
+    <section className='flex flex-col dark:text-gray-300'>
+      <hr className='w-12 my-8' />
       { BLOG.DESCRIPTION }
     </section>
 
diff --git a/themes/Fukasawa/components/Catalog.js b/themes/Fukasawa/components/Catalog.js
index c433e0d1..f5150983 100644
--- a/themes/Fukasawa/components/Catalog.js
+++ b/themes/Fukasawa/components/Catalog.js
@@ -51,7 +51,7 @@ const Catalog = ({ toc }) => {
   }, throttleMs))
 
   return <div>
-    <div className='w-full'><i className='mr-1 fas fa-stream' /> 目录</div>
+    <div className='w-full dark:text-gray-300'><i className='mr-1 fas fa-stream' /> 目录</div>
     <nav className='font-sans overflow-y-auto scroll-hidden text-black'>
       {toc.map((tocItem) => {
         const id = uuidToId(tocItem.id)
@@ -59,7 +59,7 @@ const Catalog = ({ toc }) => {
           <a
             key={id}
             href={`#${id}`}
-            className={`notion-table-of-contents-item duration-300 transform font-light
+            className={`notion-table-of-contents-item duration-300 transform font-light dark:text-gray-300
             notion-table-of-contents-item-indent-level-${tocItem.indentLevel} `}
           >
                       <span
diff --git a/themes/Fukasawa/components/GroupMenu.js b/themes/Fukasawa/components/GroupMenu.js
index 8b5f5204..8736d7ef 100644
--- a/themes/Fukasawa/components/GroupMenu.js
+++ b/themes/Fukasawa/components/GroupMenu.js
@@ -24,10 +24,10 @@ function GroupMenu ({ customNav }) {
         if (link.show) {
           const selected = (router.pathname === link.to) || (router.asPath === link.to)
           return <Link key={`${link.to}`} title={link.to} href={link.to} >
-          <a className={'py-0.5 duration-500 justify-between text-gray-500 hover:text-black hover:underline cursor-pointer flex flex-nowrap items-center ' +
+          <a className={'py-0.5 duration-500 justify-between text-gray-500 dark:text-gray-300 hover:text-black hover:underline cursor-pointer flex flex-nowrap items-center ' +
               (selected ? 'text-black' : ' ')} >
               <div className='my-auto items-center justify-center flex '>
-                <div className={ 'text-gray-500 hover:text-black'}>{link.name}</div>
+                <div className={ 'hover:text-black'}>{link.name}</div>
               </div>
               {link.slot}
             </a>
diff --git a/themes/Fukasawa/components/Logo.js b/themes/Fukasawa/components/Logo.js
index c1fa0451..8e90b47b 100644
--- a/themes/Fukasawa/components/Logo.js
+++ b/themes/Fukasawa/components/Logo.js
@@ -4,7 +4,7 @@ import Link from 'next/link'
 function Logo () {
   return <section className='flex'>
    <Link href='/'>
-    <a className='hover:bg-black hover:text-white border-black border-2 duration-500 px-4 py-2 cursor-pointer font-black'>{BLOG.TITLE}</a>
+    <a className='hover:bg-black hover:text-white border-black border-2 duration-500 px-4 py-2 cursor-pointer dark:text-gray-300 dark:border-gray-300 font-black'>{BLOG.TITLE}</a>
    </Link>
   </section>
 }
diff --git a/themes/Fukasawa/components/SearchInput.js b/themes/Fukasawa/components/SearchInput.js
index 803ce49c..2dcce9ac 100644
--- a/themes/Fukasawa/components/SearchInput.js
+++ b/themes/Fukasawa/components/SearchInput.js
@@ -62,9 +62,9 @@ const SearchInput = ({ currentTag, currentSearch, cRef }) => {
       defaultValue={searchKey}
     />
 
-    <div className='-ml-8 cursor-pointer dark:bg-gray-600 dark:hover:bg-gray-800 float-right items-center justify-center py-2'
+    <div className='-ml-8 cursor-pointer float-right items-center justify-center py-2'
       onClick={() => { handleSearch(searchKey) }}>
-        <i className={`hover:text-black transform duration-200 text-gray-500 cursor-pointer fas ${onLoading ? 'fa-spinner animate-spin' : 'fa-search'}`} />
+        <i className={`hover:text-black transform duration-200  text-gray-500 cursor-pointer fas ${onLoading ? 'fa-spinner animate-spin' : 'fa-search'}`} />
     </div>
 
     {(searchKey && searchKey.length &&