diff --git a/src/components/SnippetModal.tsx b/src/components/SnippetModal.tsx
index 372c1a64..02515be1 100644
--- a/src/components/SnippetModal.tsx
+++ b/src/components/SnippetModal.tsx
@@ -5,6 +5,7 @@ import { CloseIcon } from "./Icons";
 import CodePreview from "./CodePreview";
 import { SnippetType } from "../types";
 import slugify from "../utils/slugify";
+import useEscapeKey from "../hooks/useEscapeKey";
 
 type Props = {
   snippet: SnippetType;
@@ -19,6 +20,7 @@ const SnippetModal: React.FC<Props> = ({
 }) => {
   const modalRoot = document.getElementById("modal-root");
   if (!modalRoot) return null;
+  useEscapeKey(handleCloseModal);
 
   return ReactDOM.createPortal(
     <div className="modal-overlay">
diff --git a/src/hooks/useEscapeKey.ts b/src/hooks/useEscapeKey.ts
new file mode 100644
index 00000000..2ef4f70c
--- /dev/null
+++ b/src/hooks/useEscapeKey.ts
@@ -0,0 +1,16 @@
+import { useEffect } from "react"
+
+const useEscapeKey = (onEscapeEvent: () => void) => {
+  useEffect(() => {
+    const handleEscape = (event: { key: string }) => {
+      if (event.key === "Escape") onEscapeEvent();
+    }
+    window.addEventListener("keydown", handleEscape);
+
+    return () => {
+      window.removeEventListener("keydown", handleEscape);
+    }
+  }, [onEscapeEvent]);
+};
+
+export default useEscapeKey;