diff --git a/website_design/html/html.html b/website_design/html/html.html
new file mode 100644
index 0000000..dc17985
--- /dev/null
+++ b/website_design/html/html.html
@@ -0,0 +1,91 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Web Design-HTML: Z14IT-Internet Fundamentals
+
+
+
+ 
+ 
+
+
+
+
+ HTML Quick Reference Guide
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/website_design/html/html_assets/html.css b/website_design/html/html_assets/html.css
new file mode 100644
index 0000000..4fc2ca0
--- /dev/null
+++ b/website_design/html/html_assets/html.css
@@ -0,0 +1,16 @@
+#searchInput {
+ width: 99%;
+ font-size: 1.5vw;
+ border: 1px solid black;
+ margin-bottom: 1vh;
+}
+
+#referenceList {
+ list-style-type: none;
+ padding: 0;
+ margin: 0;
+}
+
+#referenceList li details {
+
+}
\ No newline at end of file
diff --git a/website_design/html/html_assets/html.js b/website_design/html/html_assets/html.js
new file mode 100644
index 0000000..17890ff
--- /dev/null
+++ b/website_design/html/html_assets/html.js
@@ -0,0 +1,17 @@
+function search() {
+ var input, filter, list, listElement, details, i, txtValue;
+ input = document.getElementById('searchInput');
+ filter = input.value.toUpperCase();
+ list = document.getElementById("referenceList");
+ listElement = list.getElementsByTagName('li');
+
+ for (i = 0; i < listElement.length; i++) {
+ details = listElement[i].getElementsByTagName("details")[0];
+ txtValue = details.textContent || details.innerText;
+ if (txtValue.toUpperCase().indexOf(filter) > -1) {
+ listElement[i].style.display = "";
+ } else {
+ listElement[i].style.display = "none";
+ }
+ }
+}