diff --git a/webclient/src/App.js b/webclient/src/App.js
index ff79797..3c60db7 100644
--- a/webclient/src/App.js
+++ b/webclient/src/App.js
@@ -180,6 +180,7 @@ function App() {
 			{settingsOpen &&
 				<div className="modal-overlay" onClick={() => setSettingsOpen(false)}>
 					<div className="modal-content" onClick={e => e.stopPropagation()}>
+						<button className="close-modal-button" onClick={() => setSettingsOpen(false)}>&times;</button>
 						<h3>Settings</h3>
 
 						<div className="setting-group">
diff --git a/webclient/src/Style-light.css b/webclient/src/Style-light.css
index 413d987..4acca66 100644
--- a/webclient/src/Style-light.css
+++ b/webclient/src/Style-light.css
@@ -484,3 +484,16 @@ button.comment {
 .modal-content .font-option {
 	margin-bottom: 0.25rem;
 }
+
+.close-modal-button {
+	position: absolute;
+	top: 0.5rem;
+	right: 0.75rem;
+	background: transparent;
+	border: none;
+	font-size: 1.5rem;
+	line-height: 1;
+	padding: 0;
+	cursor: pointer;
+	color: inherit;
+}