diff --git a/BackgroundColorChanger/index.html b/BackgroundColorChanger/index.html
index 1ee1531..d5d14ee 100644
--- a/BackgroundColorChanger/index.html
+++ b/BackgroundColorChanger/index.html
@@ -12,6 +12,7 @@
Background Color Changer
+
diff --git a/BackgroundColorChanger/script.js b/BackgroundColorChanger/script.js
index 94d0166..f4f884e 100644
--- a/BackgroundColorChanger/script.js
+++ b/BackgroundColorChanger/script.js
@@ -6,11 +6,16 @@ function bgchange(color) {
var colorarray = ["#e58e26", "#f9b4ab", "#B1FB17", "#78e08f", "#fd79a8"];
var colorbox = document.getElementById("colorbox");
+let hexcode = document.getElementById('hexcode');
+
colorarray.forEach(function (color, index) {
let span = document.createElement("span");
span.style.backgroundColor = color;
span.addEventListener("click", function () {
bgchange(index);
+
+ // Display the color code
+ hexcode.innerHTML = colorarray[index].toUpperCase();
});
colorbox.appendChild(span);
});
diff --git a/BackgroundColorChanger/style.css b/BackgroundColorChanger/style.css
index 1c9ab56..9955039 100644
--- a/BackgroundColorChanger/style.css
+++ b/BackgroundColorChanger/style.css
@@ -11,7 +11,13 @@ body {
h1 {
color: #6203e0;
- margin-bottom: 2rem;
+ margin-bottom: 1rem;
+}
+
+p {
+ font-family: monospace;
+ padding: 5px;
+ font-size: large;
}
#colorbox {