diff --git a/src/components/molecules/ThemeSwitch.jsx b/src/components/molecules/ThemeSwitch.jsx
index 8437f5e..9670e07 100644
--- a/src/components/molecules/ThemeSwitch.jsx
+++ b/src/components/molecules/ThemeSwitch.jsx
@@ -13,19 +13,19 @@ const Animation = posed.aside(fadeIn)
 
 const ThemeToggle = ({ dark }) => (
   <span id="toggle" className={styles.checkboxContainer} aria-live="assertive">
-    <Day className={dark ? null : 'active'} />
+    <Day className={!dark ? null : 'active'} />
     <span className={styles.checkboxFake} />
     <Night className={dark ? 'active' : null} />
   </span>
 )
 
 ThemeToggle.propTypes = {
-  dark: PropTypes.bool
+  dark: PropTypes.bool.isRequired
 }
 
 const ThemeToggleInput = ({ dark, toggleDark }) => (
   <input
-    onChange={toggleDark()}
+    onChange={() => toggleDark()}
     type="checkbox"
     name="toggle"
     value="toggle"
@@ -35,8 +35,8 @@ const ThemeToggleInput = ({ dark, toggleDark }) => (
 )
 
 ThemeToggleInput.propTypes = {
-  dark: PropTypes.bool,
-  toggleDark: PropTypes.func
+  dark: PropTypes.bool.isRequired,
+  toggleDark: PropTypes.func.isRequired
 }
 
 export default class ThemeSwitch extends PureComponent {
diff --git a/src/store/AppProvider.jsx b/src/store/AppProvider.jsx
index dd659d0..c6f2dab 100644
--- a/src/store/AppProvider.jsx
+++ b/src/store/AppProvider.jsx
@@ -7,7 +7,7 @@ import { getCountry } from '../utils/getCountry'
 export default class AppProvider extends PureComponent {
   state = {
     dark: false,
-    toggleDark: () => this.toggleDark,
+    toggleDark: () => this.toggleDark(),
     geolocation: null
   }