diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..e43b0f9
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+.DS_Store
diff --git a/LICENCE b/LICENCE
new file mode 100644
index 0000000..f5c579f
--- /dev/null
+++ b/LICENCE
@@ -0,0 +1,15 @@
+ISC License
+
+Copyright (c) 2023 Tshaka Lekholoane
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..9380b82
--- /dev/null
+++ b/README.md
@@ -0,0 +1,13 @@
+# Invert
+
+A Chrome extension to invert the colours of a web page.
+
+## Usage
+
+Click the extension button or use the shortcut ⌃ + B or ⌘ + B on macOS to toggle the colours on the page in the current tab.
+
+## Installation 
+
+1. Go to the extensions page by entering `chrome://extensions` in a new tab.
+2. Enable Developer Mode by clicking the toggle switch in the upper right corner.
+3. Click the **Load unpacked** button and select the extension directory.
\ No newline at end of file
diff --git a/background.js b/background.js
new file mode 100644
index 0000000..ea2a3f1
--- /dev/null
+++ b/background.js
@@ -0,0 +1,29 @@
+chrome.runtime.onInstalled.addListener(() => {
+  chrome.action.setBadgeText({ text: "OFF" });
+});
+
+const toggle = (state) => state === "ON" ? "OFF" : "ON";
+
+chrome.action.onClicked.addListener(async (tab) => {
+  let state = await chrome.action.getBadgeText({ tabId: tab.id });
+  state = toggle(state);
+
+  await chrome.action.setBadgeText({
+    tabId: tab.id,
+    text: state,
+  });
+
+  const details = {
+    files: ["invert.css"],
+    target: { tabId: tab.id },
+  };
+
+  switch (state) {
+    case "ON":
+      await chrome.scripting.insertCSS(details);
+      break;
+    case "OFF":
+      await chrome.scripting.removeCSS(details);
+      break;
+  }
+});
diff --git a/icons/128.png b/icons/128.png
new file mode 100644
index 0000000..bd6fde2
Binary files /dev/null and b/icons/128.png differ
diff --git a/icons/16.png b/icons/16.png
new file mode 100644
index 0000000..51b5ef5
Binary files /dev/null and b/icons/16.png differ
diff --git a/icons/32.png b/icons/32.png
new file mode 100644
index 0000000..a6d7f58
Binary files /dev/null and b/icons/32.png differ
diff --git a/icons/48.png b/icons/48.png
new file mode 100644
index 0000000..024e6ad
Binary files /dev/null and b/icons/48.png differ
diff --git a/invert.css b/invert.css
new file mode 100644
index 0000000..5c6ca1e
--- /dev/null
+++ b/invert.css
@@ -0,0 +1,3 @@
+html {
+  filter: invert(90%);
+}
diff --git a/manifest.json b/manifest.json
new file mode 100644
index 0000000..05b7e62
--- /dev/null
+++ b/manifest.json
@@ -0,0 +1,35 @@
+{
+  "manifest_version": 3,
+  "name": "Invert",
+  "description": "Invert the colour of web pages.",
+  "version": "1.0",
+  "icons": {
+    "16": "icons/16.png",
+    "32": "icons/32.png",
+    "48": "icons/48.png",
+    "128": "icons/128.png"
+  },
+  "background": {
+    "service_worker": "background.js"
+  },
+  "action": {
+    "default_icon": {
+      "16": "icons/16.png",
+      "32": "icons/32.png",
+      "48": "icons/48.png",
+      "128": "icons/128.png"
+    }
+  },
+  "permissions": [
+    "scripting",
+    "activeTab"
+  ],
+  "commands": {
+    "_execute_action": {
+      "suggested_key": {
+        "default": "Ctrl + B",
+        "mac": "Command + B"
+      }
+    }
+  }
+}
\ No newline at end of file