1 files changed, 73 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..5f099cc
--- /dev/null
+++ b/index.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>Telechromy</title>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" type="text/css" href="/static/styles.css">
+    <link rel="stylesheet" type="text/css" href="/telechromy/static/styles.css">
+    <link rel="shortcut icon" type="image/x-icon" href="/telechromy/static/favicon.ico">
+  </head>
+  <body id="body">
+	<div class="container">
+        <div class="center-container">
+           <div>
+                <div class="home">
+                    <a href="/telechromy" class="home-title">Telechromy</a>
+                    <span> at </span><a href="/">cyfraeviolae.org</a>
+                </div>
+                <div class="crumbs">
+                    <a href="/git/telechromy">source code</a>
+                </div>
+            </div>
+            <noscript>Sorry, JavaScript is required to play Telechromy.</noscript>
+            <div id="prompt" style="display: none;">
+                <p>
+                    Describe the background color without using color words or numbers.
+                    <br>
+                    <small>
+                        You could use <span class="nb">objects (<em>a moonlit glade</em>)</span>,
+                        <span class="nb">emotions (<em>latent bitterness</em>)</span>,
+                        <span class="nb">ideas (<em>intuitionism</em>)</span>,
+                        or <span class="nb">memories (<em>our first kiss</em>)</span>.
+                    </small>
+                </p>
+                <input id="entry" type="text">
+                <div id="share" style="display: none;">
+                    <p>
+                        Share this link with a friend.
+                    </p>
+                        <input id="url" type="text" readonly>
+                        <button id="copy">Copy</button>
+                        <button id="visit">Visit</button>
+                </div>
+            </div>
+            <div id="guess" style="display: none;">
+                <p>
+                    Select the color described by
+                    <br>
+                    <span id="challenge"></span>
+                </p>
+                <input id="color" type="color">
+                <br>
+                <br>
+                <button id="submit">Submit</button>
+            </div>
+            <div id="result" style="display: none;">
+                <p>
+                    <span id="prompt-text"></span>
+                </p>
+            </div>
+        </div>
+    </div>
+    <div id="labels" style="display: none;">
+        <div class="prompt-label label">
+            Prompt
+        </div>
+        <div class="guess-label label">
+            Guess
+        </div>
+    </div>
+    <script src="/telechromy/static/script.js"></script>
+  </body>
+</html>