diff --git a/Html/vidit-Hello-world/vidit-Hello-world.css b/Html/vidit-Hello-world/vidit-Hello-world.css
new file mode 100644
index 000000000..319e40231
--- /dev/null
+++ b/Html/vidit-Hello-world/vidit-Hello-world.css
@@ -0,0 +1,57 @@
+body {
+ background-color: lightcoral;
+}
+
+.header {
+ width:100%;
+ height:100px;
+ position: relative;
+ top:40%;
+}
+
+.container {
+ display: inline-block;
+ height:50px;
+ position: absolute;
+ top: 20px;
+ left: 42%;
+}
+
+
+.msg {
+ font-size: 25px;
+}
+button {
+ width: 200px;
+ height:50px;
+ background-color: aquamarine;
+ border: none;
+ border-top-left-radius: 10px;
+ border-bottom-right-radius: 10px;
+ box-shadow: 0 10px darkgoldenrod;
+ color:white;
+ cursor: pointer;
+
+}
+
+button:active {
+ position: relative;
+ top:7px;
+ box-shadow: none;
+ color: rebeccapurple;
+ font-weight: bold;
+
+}
+#btn {
+ font-size: 25px;
+ font-family: cursive;
+}
+#hello {
+ font-size: 50px;
+ font-family: cursive;
+ color: blueviolet;
+ font-style: oblique;
+ font-weight: bold;
+ text-align: center;
+ text-decoration: underline brown;
+}
diff --git a/Html/vidit-Hello-world/vidit-Hello-world.html b/Html/vidit-Hello-world/vidit-Hello-world.html
new file mode 100644
index 000000000..3d4d2ac1b
--- /dev/null
+++ b/Html/vidit-Hello-world/vidit-Hello-world.html
@@ -0,0 +1,22 @@
+
+
+ Hello-World
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/Html/vidit-Hello-world/vidit-Hello-world.js b/Html/vidit-Hello-world/vidit-Hello-world.js
new file mode 100644
index 000000000..b9cc92375
--- /dev/null
+++ b/Html/vidit-Hello-world/vidit-Hello-world.js
@@ -0,0 +1,6 @@
+document.getElementById("btn").onclick = function() {
+ document.getElementById("btn").innerHTML = "Button Clicked";
+ document.getElementById("hello").innerHTML = "Hello-World";
+ document.getElementById("body").style.backgroundColor = "lightgreen";
+
+}