diff --git a/src/includes/head.html b/src/includes/head.html
index a32c5d9..3ea12cf 100644
--- a/src/includes/head.html
+++ b/src/includes/head.html
@@ -1,8 +1,9 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <link rel="icon" href="/resources/images/favicon.png">
-<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Crimson+Text:400,800|Maven+Pro:400,700,900|Montserrat:400,700|PT+Mono&display=swap">
+<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:400,700|Maven+Pro:400,700,900|Montserrat:400,700|PT+Mono&display=swap">
 <link rel="stylesheet" href="/resources/css/common.css">
+<script src="/resources/js/common.js"></script>
 
 <!-- General metatags -->
 <meta name="author" content="Caddy Web Server">
@@ -21,3 +22,7 @@
 <meta name="twitter:description" value="Caddy is a powerful, enterprise-ready, open source web server with automatic HTTPS written in Go">
 <meta name="twitter:image" content="https://caddyserver.com/resources/images/caddy-open-graph.jpg">
 <meta name="twitter:url" value="https://caddyserver.com/">
+
+<!-- Algolia -->
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css">
+<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
\ No newline at end of file
diff --git a/src/includes/header-nav.html b/src/includes/header-nav.html
index 3c1e70d..82390d7 100644
--- a/src/includes/header-nav.html
+++ b/src/includes/header-nav.html
@@ -1,5 +1,6 @@
 <!--TODO: add class="current" to the current link-->
 <nav>
+	<input type="search" id="search" placeholder="🔍 Search...">
 	<a href="https://github.com/caddyserver/caddy/releases">Download</a>
 	<a href="/docs/">Documentation</a>
 	<a href="https://github.com/caddyserver/caddy">GitHub</a>
diff --git a/src/index.html b/src/index.html
index 8fd72ab..e94873b 100644
--- a/src/index.html
+++ b/src/index.html
@@ -3,9 +3,9 @@
 	<head>
 		<title>Caddy 2 - The Ultimate Server with Automatic HTTPS</title>
 		{{include "/includes/head.html"}}
+		<link rel="stylesheet" href="/resources/css/home.css">
 		<meta property="og:title" content="Caddy 2 - The Ultimate Server with Automatic HTTPS">
 		<meta name="twitter:title" value="Caddy 2 - The Ultimate Server with Automatic HTTPS">
-		<link rel="stylesheet" href="/resources/css/home.css">
 	</head>
 	<body>
 		<div class="hero">
diff --git a/src/resources/css/common.css b/src/resources/css/common.css
index cbd7467..07591f4 100644
--- a/src/resources/css/common.css
+++ b/src/resources/css/common.css
@@ -5,7 +5,7 @@
 }
 
 body {
-	font-family: Maven Pro, sans-serif;
+	font-family: Inter, sans-serif;
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 	tab-size: 4;
@@ -62,7 +62,8 @@ header nav {
 	line-height: 40px;
 }
 
-header nav a {
+
+header nav > a {
 	display: inline-block;
 	padding-left: 10px;
 	padding-right: 10px;
@@ -70,19 +71,33 @@ header nav a {
 	color: inherit;
 }
 
-header nav a:hover {
+header nav > a:hover {
 	color: #ff3f2c;
 }
 
-header nav a.current {
+header nav > a.current {
 	font-weight: bold;
 }
 
+/* Algolia search */
+#search {
+	border-radius: 5px;
+	border: 1px solid rgba(0, 0, 0, .2);
+	font-size: 14px;
+	padding: 8px;
+	background: none;
+	width: 150px;
+	max-width: 100%;
+	margin-right: 20px;
+}
+
+/* End Algolia search */
+
 header nav .button {
 	margin: 0 0 0 10px;
 	padding-top: 2px;
 	padding-bottom: 2px;
-}
+}  
 
 .button {
 	border-radius: 2em;
@@ -198,176 +213,3 @@ footer > div {
 		text-align: center;
 	}
 }
-
-
-/* font resources */
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 100;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Thin-BETA.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Thin-BETA.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 100;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-ThinItalic-BETA.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-ThinItalic-BETA.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 200;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-ExtraLight-BETA.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-ExtraLight-BETA.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 200;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-ExtraLightItalic-BETA.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-ExtraLightItalic-BETA.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 300;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Light-BETA.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Light-BETA.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 300;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-LightItalic-BETA.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-LightItalic-BETA.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 400;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Regular.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Regular.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 400;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Italic.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Italic.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 500;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Medium.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Medium.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 500;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-MediumItalic.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-MediumItalic.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 600;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-SemiBold.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-SemiBold.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 600;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-SemiBoldItalic.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-SemiBoldItalic.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 700;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Bold.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Bold.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 700;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-BoldItalic.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-BoldItalic.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 800;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-ExtraBold.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-ExtraBold.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 800;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-ExtraBoldItalic.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-ExtraBoldItalic.woff") format("woff");
-}
-  
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  normal;
-	font-weight: 900;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-Black.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-Black.woff") format("woff");
-}
-
-@font-face {
-	font-family: 'Inter';
-	font-style:  italic;
-	font-weight: 900;
-	font-display: swap;
-	src: url("/resources/fonts/Inter-BlackItalic.woff2") format("woff2"),
-		 url("/resources/fonts/Inter-BlackItalic.woff") format("woff");
-}
diff --git a/src/resources/css/docs.css b/src/resources/css/docs.css
index 421ff0b..90b9711 100644
--- a/src/resources/css/docs.css
+++ b/src/resources/css/docs.css
@@ -1,3 +1,7 @@
+body {
+	font-family: Maven Pro, sans-serif;
+}
+
 header {
 	border-bottom: 1px solid #f0f6f7;
 	padding: 10px 20px;
diff --git a/src/resources/css/home.css b/src/resources/css/home.css
index cc13599..b0646c4 100644
--- a/src/resources/css/home.css
+++ b/src/resources/css/home.css
@@ -2,6 +2,10 @@ body {
 	font-family: 'Inter', sans-serif;
 }
 
+#search {
+	margin-top: 4px;
+}
+
 .hero {
 	background-image: url('/resources/images/bg-teal.jpg');
 	background-repeat: no-repeat;
diff --git a/src/resources/js/common.js b/src/resources/js/common.js
new file mode 100644
index 0000000..00eb5f8
--- /dev/null
+++ b/src/resources/js/common.js
@@ -0,0 +1,9 @@
+document.addEventListener('DOMContentLoaded', function() {
+	// Algolia search
+	docsearch({
+		apiKey: '14275a785f6ebd31d162f9d2d8fc0125',
+		indexName: 'caddyserver',
+		inputSelector: '#search',
+		debug: true // Set debug to true if you want to inspect the dropdown
+	});
+});
