diff --git a/Public/bgGenerator.html b/Public/bgGenerator.html
new file mode 100644
index 00000000..85c52c79
--- /dev/null
+++ b/Public/bgGenerator.html
@@ -0,0 +1,17 @@
+
+
+
+
+
+ Document
+
+
+
+ BACKGROUND GENERATOR
+
+
+ Current CSS Background
+
+
+
+
\ No newline at end of file
diff --git a/README.md b/README.md
index d092bd7e..74afd71a 100644
--- a/README.md
+++ b/README.md
@@ -265,7 +265,7 @@ git push -u origin
| 169. | [Tearable Cloth](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/tearable-cloth.html)| 170. | [Rain Effects](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/RainEffects.html)| 171. | [Camera Web App](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/camera_app.html)
| 172. | [Dynamic Picture Frame](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/picture-frame.html)| 173. | [FAQ Collapse](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/FAQcollapse.html)| 174. | [Multiplication Table Generator](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/multiplication-table-generator.html)
| 175. | [Expense Tracker Calculator](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/trackerExpense/index.html)| 176. | [Check my IP](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/check-my-ip/check-my-ip.html) | 177. | [SocialTray](https://rococo-praline-28f4e4.netlify.app/)
-| 178. | [SimplyRecipes](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/SimplyRecipes/) | 179. | [Employee DataBase](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/employeeDatabase.html)
+| 178. | [SimplyRecipes](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/SimplyRecipes/) | 179. | [Employee DataBase](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/employeeDatabase.html) | 180. | [Background Generator](https://zerooctave.github.io/ZeroOctave-Javascript-Projects/Public/bgGenerator.html)
diff --git a/assets/Images/bgGenerator.png b/assets/Images/bgGenerator.png
new file mode 100644
index 00000000..be962be3
Binary files /dev/null and b/assets/Images/bgGenerator.png differ
diff --git a/assets/Js/bgGenerator.js b/assets/Js/bgGenerator.js
new file mode 100644
index 00000000..35761db4
--- /dev/null
+++ b/assets/Js/bgGenerator.js
@@ -0,0 +1,20 @@
+var css = document.querySelector("h3");
+var color1 = document.querySelector(".color1");
+var color2 = document.querySelector(".color2");
+var body = document.getElementById("gradient");
+
+
+function setGradient(){
+ body.style.background =
+ "linear-gradient(to right,"
+ + color1.value
+ + ","
+ + color2.value
+ +")";
+
+ css.textContent = body.style.background + ";";
+
+}
+// color1.addEventListener("input",setGradient);
+
+// color2.addEventListener("input",setGradient);
\ No newline at end of file
diff --git a/assets/css/bgGenerator.css b/assets/css/bgGenerator.css
new file mode 100644
index 00000000..d3345fd5
--- /dev/null
+++ b/assets/css/bgGenerator.css
@@ -0,0 +1,28 @@
+body{
+ font: 'Raleway', sans-serif;
+ color: rgba(0, 0, 0, .5);
+ text-align: center;
+ text-transform: uppercase;
+ letter-spacing: .5em;
+ top: 15%;
+ background: linear-gradient(to right,red,blue);
+
+
+
+}
+h1{
+ font: 600 3.5em 'Raleway', sans-serif;
+ color: rgba(0, 0, 0, .5);
+ text-align: center;
+ text-transform: uppercase;
+ letter-spacing: .5em;
+ width: 100%;
+
+}
+h3{
+ font: 900 1em 'Raleway', sans-serif;
+ color: rgba(0, 0, 0, .5);
+ text-align: center;
+ text-transform: none;
+ letter-spacing: 0.01em;
+}
\ No newline at end of file