diff --git a/datalist.html b/datalist.html
new file mode 100644
index 0000000..d071b9c
--- /dev/null
+++ b/datalist.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width">
+  <title>Datalist</title>
+  <style>
+    .container {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      height: 100vh;
+    }
+  </style>
+</head>
+<body>
+
+<div class="container">
+  <h1>Datalist</h1>
+  <p>This project is demonstrating an input field with autosugestions.</p>
+  <br>
+  <div class="switch-container">
+    <h2>Basic Input</h2>
+    <label>
+      <input type="input" id="input-1">
+      Basic Input with no styling
+    </label>
+    <h2>Input with sugestions</h2>
+    <label>
+      <input list="framworks" id="input-2">
+      Input with sugestions
+      <datalist id="framworks">
+        <option value="React">
+        <option value="Angular">
+        <option value="Vue">
+        <option value="Svelte">
+        <option value="Ember">
+        <option value="Vanilla">
+      </datalist>
+    </label>
+  </div>
+</div>
+
+</body>
+</html>
