diff --git a/Components/Card.js b/Components/Card.js
index d8c11f6..85a2407 100644
--- a/Components/Card.js
+++ b/Components/Card.js
@@ -12,7 +12,7 @@
                 backgroundImage:`linear-gradient(69.44deg, #${this.props.gradient[0]} 0%, #${this.props.gradient[1]} 100%)`,
                 margin: "0"
             }}>
-                <img alt="" className={Styles.backgroundImage} src={`/Waves/${this.props.wave}.svg`} />
+                <img alt="" className={Styles.backgroundImage} src={`/Waves/${this.props.wave}.svg`} draggable={false} />
                 <div className={Styles.panel}>
                     <div className={Styles.titleContainer}>
                         <img alt="Project icon" className={Styles.image} src={"/Icons/" + (this.props.icon ? this.props.icon : this.props.wave) + ".svg"} />
diff --git a/Components/Header.js b/Components/Header.js
index 51bd412..5aed6f3 100644
--- a/Components/Header.js
+++ b/Components/Header.js
@@ -25,7 +25,7 @@
                     <meta name="author" content="Clicks Minute Per" />
                     <meta name="og:author" content="Clicks Minute Per" />
                 </Head>
-                <img alt="" className={Styles.backgroundImage} src={`/Headers/${this.props.wave}.svg`} />
+                <img draggable={false} alt="" className={Styles.backgroundImage} src={`/Headers/${this.props.wave}.svg`} />
                 <div className={Styles.panel}>
                     <div className={Styles.titleContainer}>
                         <h1 className={Styles.title}>{this.props.name}</h1>
@@ -47,8 +47,8 @@
                         }
                     </div>
                 </div>
-                <span className={Styles.arrowSpan + " " + (this.props.hideArrow ? Styles.arrowHidden : null)}>
-                    <a href="#start"><img alt="Down arrow" src="/Arrow.svg" className={Styles.arrow} draggable={false} /></a>
+                <span className={Styles.arrowSpan + " " + (this.props.hideArrow ? Styles.arrowHidden : null)} draggable={false}>
+                    <a href="#start" draggable={false}><img alt="Down arrow" src="/Arrow.svg" className={Styles.arrow} draggable={false} /></a>
                 </span>
             </div>
 		)
diff --git a/Components/NavBar.js b/Components/NavBar.js
index 38c1275..c838f28 100644
--- a/Components/NavBar.js
+++ b/Components/NavBar.js
@@ -1,19 +1,13 @@
 import React, { Component } from "react";
 import Styles from '../styles/navbar.module.css';
-import Cookies from 'js-cookie';
 import ThemeChangeButton from './ThemeChangeButton';
-// import { setInfo } from "../redux/actions/main"
-// import { connect } from "react-redux";
-// import { makeStore } from "../redux/store";
 
-// const store = makeStore();
 
 class NavBar extends Component {
 	constructor(props) {
 		super(props);
         this.state = {
             isOpen: false,
-            cookie: 'light'
         }
         this.isTouchDevice = false
         this.hoverSensor = React.createRef();
@@ -41,9 +35,6 @@
         } else {
             this.isTouchDevice = false
         }
-        this.setState({
-            cookie: Cookies.get('theme')
-        })
     }
 
     onClick() {
@@ -80,16 +71,4 @@
 	}
 }
 
-
-// const mapStateToProps = state => {
-//     return { theme: state.main.theme }
-// }
-
-// const mapDispatchToProps = {
-//     setInfo
-// }
-
-// const nav = connect(mapStateToProps, mapDispatchToProps)(NavBar);
-// export default nav;
-
 export default NavBar;
\ No newline at end of file
diff --git a/Components/ThemeChangeButton.js b/Components/ThemeChangeButton.js
index 50f1cc2..b4c80c8 100644
--- a/Components/ThemeChangeButton.js
+++ b/Components/ThemeChangeButton.js
@@ -1,20 +1,29 @@
 /** @jsxImportSource theme-ui */
 import { useColorMode } from 'theme-ui';
-import Styles from '../styles/navbar.module.css'
+import Styles from '../styles/navbar.module.css';
+import Light from '../public/light.svg';
+import Dark from '../public/dark.svg';
+import { useState, useEffect } from 'react';
+
 
 const ThemeChangeButton = () => {
     const [colorMode, setColorMode] = useColorMode()
+    const [render, setRender] = useState(false);
+
+    useEffect(() => {
+        setRender(true);
+    });
+
     return (
         <header>
-            <a onClick={(e) => {
-                    e.preventDefault();
-                    setColorMode(colorMode === 'light' ? 'dark' : 'light');
-                }}>
-            <img
-                alt="Theme"
-                className={Styles.icon}
-                src={`/${colorMode}.svg`}
-            /></a>
+            <a className={Styles.icon + " " + Styles.ThemeChangeButton} onClick={(e) => {
+                e.preventDefault();
+                setColorMode(colorMode === 'light' ? 'dark' : 'light');
+            }}>
+            {
+                !render ? null : (colorMode == 'light' ? <Light /> : <Dark />)
+            }
+            </a>
         </header>
     )
 }