diff --git a/src/assets/icons/oucc.svg b/src/assets/oucc.svg
similarity index 97%
rename from src/assets/icons/oucc.svg
rename to src/assets/oucc.svg
index 77992a0..611d0bc 100644
--- a/src/assets/icons/oucc.svg
+++ b/src/assets/oucc.svg
@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 592 381.58667">
+<svg xmlns="http://www.w3.org/2000/svg" width="592" height="381.58667">
   <path
     d="M579.82131884 158.91467557H444.27332223c-12.38933303 0-22.55999944-10.13066642-22.55999944-22.51333277V45.92934506c0-12.40266636 10.17066641-22.5146661 22.55999944-22.5146661h135.5479966c-.15333332-12.28666637-10.22799974-22.28399945-22.5586661-22.28399945H421.94265613c-12.4079997 0-22.55999944 10.13199975-22.55999944 22.51333277v135.0226633c0 12.40133302 10.15199975 22.53199943 22.55999944 22.53199943h135.31999662c12.33066635 0 22.40533277-9.99733308 22.5586661-22.28399944M579.82131884 359.28253722H444.27332223c-12.38933303 0-22.55999944-10.11199974-22.55999944-22.5130661v-90.4534644c0-12.38266636 10.17066641-22.51333278 22.55999944-22.51333278h135.5479966c-.15333332-12.30666635-10.22799974-22.28533277-22.5586661-22.28533277H421.94265613c-12.4079997 0-22.55999944 10.13199975-22.55999944 22.4946661v135.04132996c0 12.40259969 10.15199975 22.53333277 22.55999944 22.53333277h135.31999662c12.33066635 0 22.40533277-9.99739975 22.5586661-22.30413278M157.4413294 45.90934506c0-12.38266636-10.15199975-22.51333277-22.55999944-22.51333277h-90.6594644c-12.40786636 0-22.5598661 10.13066641-22.5598661 22.51333277v90.45333107c0 12.40266636 10.15199974 22.53333277 22.5598661 22.53333277h90.6594644c12.4079997 0 22.55999944-10.13066641 22.55999944-22.53333277zm22.32933277 112.73866385c0 12.41999969-10.15199974 22.53199943-22.55999943 22.53199943H21.91093279c-12.44634636 0-22.5791621-10.11199974-22.5791621-22.53199943V23.6053456c0-12.36266635 10.13281574-22.49333276 22.5791621-22.49333276h135.29972995c12.40799969 0 22.55999943 10.1306664 22.55999943 22.49333277V158.6480089"
     fill="#231815"
diff --git a/src/components/index/about/AboutSection.astro b/src/components/index/about/AboutSection.astro
index 52ac664..4ee7d46 100644
--- a/src/components/index/about/AboutSection.astro
+++ b/src/components/index/about/AboutSection.astro
@@ -1,16 +1,19 @@
 ---
+import type { ImageMetadata } from 'astro'
 import Section from '@/components/common/Section.astro'
 import Icon from '@/components/common/Icon.astro'
+import Image from '@/components/common/Image.astro'
+import ouccImage from '@/assets/oucc.svg'
 import AboutCard from './AboutCard.astro'
 
 interface Item {
-  icon: string
+  icon: string | ImageMetadata
   description: string[]
 }
 
 const items: Item[] = [
   {
-    icon: 'oucc',
+    icon: ouccImage,
     description: [
       'OUCC（大阪大学コンピュータクラブ）は、コンピュータを使ったものづくりに関心を持つ学生が交流するサークルです。',
       'プログラミングやお絵描き、3Dモデリングなどの活動を行っています。',
@@ -43,7 +46,13 @@ const items: Item[] = [
       items.map(({ icon, description }) => (
         <li class="flex-1 max-w-[32rem] flex items-stretch">
           <AboutCard>
-            <Icon slot="icon" name={icon} alt="" class="w-20 h-20" />
+            <Fragment slot="icon">
+              {typeof icon === 'string' ? (
+                <Icon name={icon} alt="" class="w-20 h-20" />
+              ) : (
+                <Image src={icon} alt="" class="w-20 h-20 object-contain" />
+              )}
+            </Fragment>
             {description.map((x) => (
               <p>{x}</p>
             ))}
diff --git a/src/components/layout/Footer.astro b/src/components/layout/Footer.astro
index 466d745..52daa83 100644
--- a/src/components/layout/Footer.astro
+++ b/src/components/layout/Footer.astro
@@ -1,11 +1,12 @@
 ---
-import Icon from '@/components/common/Icon.astro'
+import Image from '@/components/common/Image.astro'
+import ouccImage from '@/assets/oucc.svg'
 import FooterLink from './FooterLink.astro'
 ---
 
 <footer class="py-8 flex flex-wrap justify-center items-center gap-8">
   <div class="px-4 flex flex-wrap justify-center items-center gap-4">
-    <Icon name="oucc" alt="OUCC" class="w-12" />
+    <Image src={ouccImage} alt="OUCC" class="w-12" />
     <span class="text-sm">© 2023 大阪大学コンピュータクラブ</span>
   </div>
   <div class="px-4 flex flex-wrap justify-center items-center gap-4">
diff --git a/src/components/layout/nav/Header.astro b/src/components/layout/nav/Header.astro
index 5e69ff0..e05beaf 100644
--- a/src/components/layout/nav/Header.astro
+++ b/src/components/layout/nav/Header.astro
@@ -1,5 +1,7 @@
 ---
 import Icon from '@/components/common/Icon.astro'
+import Image from '@/components/common/Image.astro'
+import ouccImage from '@/assets/oucc.svg'
 import LinkButton from '@/components/common/button/LinkButton.astro'
 import Navigation from './Navigation.astro'
 
@@ -38,11 +40,9 @@ const {
       />
     </button>
     <a href={rootPath} class="flex items-center">
-      <Icon
-        name="oucc"
-        alt="OUCC"
-        class="block max-h-full min-h-full h-16 aspect-square"
-      />
+      <span class="h-full aspect-square">
+        <Image src={ouccImage} alt="OUCC" class="h-full object-contain" />
+      </span>
       {headerTitle && <h1 class="text-4xl font-bold mx-4">{headerTitle}</h1>}
     </a>
   </div>
diff --git a/src/components/layout/nav/Navigation.astro b/src/components/layout/nav/Navigation.astro
index 5b0afbc..e65a7b3 100644
--- a/src/components/layout/nav/Navigation.astro
+++ b/src/components/layout/nav/Navigation.astro
@@ -1,12 +1,13 @@
 ---
-import Icon from '@/components/common/Icon.astro'
+import Image from '@/components/common/Image.astro'
+import ouccImage from '@/assets/oucc.svg'
 import NavigationListItem from './NavigationListItem.astro'
 import DrWani from './DrWani.astro'
 ---
 
 <nav class="w-full h-full bg-white flex flex-col">
   <div class="py-2 flex justify-center">
-    <Icon name="oucc" alt="OUCC" class="w-20 aspect-square" />
+    <Image src={ouccImage} alt="OUCC" class="w-20 h-20 object-contain" />
   </div>
   <ul class="flex flex-col text-center">
     <NavigationListItem to="/">トップページ</NavigationListItem>