diff --git a/index.html b/index.html
new file mode 100644
index 0000000..b776f0a
--- /dev/null
+++ b/index.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>SopKit | Web developer tools</title>
+    <meta name="description" content="Validators, generators, and converters for web developers">
+    <meta name="keywords" content="web development, HTML, CSS, JavaScript, encoding, validation, converters">
+    <meta name="author" content="SopKit">
+    <link rel="stylesheet" href="/style.css">
+</head>
+<body>
+    <h1 class="main-title">Web developer tools</h1>
+    <h2 class="category-title">Validators, generators, and converters</h2>
+    <ul class="tool-list">
+        <li><a href="./unquoted-attributes">HTML/CSS/JS unquoted attribute value validator</a></li>
+        <li><a href="./ampersands">Ambiguous ampersand checker for HTML</a></li>
+        <li><a href="./custom-element-name">Custom HTML element name validator</a></li>
+        <li><a href="./css-escapes">CSS escaper</a></li>
+        <li><a href="./font-family">Unquoted CSS font family name validator</a></li>
+        <li><a href="./js-escapes">JavaScript escaper</a></li>
+        <li><a href="./operator-precedence">JavaScript operator precedence</a></li>
+        <li><a href="./js-variables">JavaScript variable name validator</a></li>
+        <li><a href="./js-properties">JavaScript property name validator</a></li>
+        <li><a href="./punycode">Punycode IDN domain name converter</a></li>
+        <li><a href="./html-entities">HTML entity encoder/decoder</a></li>
+        <li><a href="./url">URL encoder/decoder</a></li>
+        <li><a href="./bgcolor">Legacy HTML color value previewer (<code>bgcolor</code>, <code>text</code>, <code>link</code>, <code>vlink</code>, and <code>alink</code> attribute values)</a></li>
+        <li><a href="./base64">Base64 encoder/decoder</a></li>
+        <li><a href="./utf-8">UTF-8 encoder/decoder</a></li>
+        <li><a href="./wtf-8">WTF-8 encoder/decoder</a></li>
+        <li><a href="./quoted-printable"><code>Quoted-Printable</code> encoder/decoder</a></li>
+        <li><a href="./q"><code>Q</code> encoder/decoder</a></li>
+        <li><a href="./binary-ascii">Binary ↔ ASCII converter</a></li>
+        <li><a href="./bacon">Bacon’s cipher encoder/decoder</a></li>
+        <li><a href="./regexpu">JavaScript regular expression transpiler</a></li>
+        <li><a href="./reverse-string">String reverser</a></li>
+    </ul>
+    <h2 class="category-title">Miscellaneous</h2>
+    <ul class="tool-list">
+        <li><a href="./byte-counter">String length & UTF-8 byte counter</a></li>
+        <li><a href="./lua-minifier">Lua minifier</a></li>
+        <li><a href="./brainfuck-minifier">Brainfuck minifier</a></li>
+        <li><a href="./twitalics">Twitalics</a></li>
+    </ul>
+    <h2 class="category-title">External (not mine)</h2>
+    <ul class="tool-list">
+        <li><a href="http://mothereffingtextshadow.com/">text-shadow</a> and <a href="//sassymothereffingtextshadow.com/">sassy mothereffing text-shadow</a></li>
+        <li><a href="http://mothereffinghsl.com/">HSL</a></li>
+        <li><a href="http://mothereffinganimatedgif.com/">Drag & drop animated GIF creator</a></li>
+    </ul>
+</body>
+</html>
