MORE NEONNN

script.js

@@ -1,7 +1,7 @@
 document.getElementById('generateBtn').addEventListener('click', generateGradient);
 
 function generateGradient() {
-    const colors = generateRandomColors(4);
+    const colors = generatePresetColors();
     const gradient = `linear-gradient(90deg, ${colors.join(', ')})`;
     const previewElement = document.getElementById('gradientPreview');
     previewElement.style.background = gradient;
@@ -11,10 +11,15 @@ function generateGradient() {
     document.getElementById('cssOutput').value = `background: ${gradient};\nbackground-size: 400% 400%;\nanimation: gradientAnimation 15s ease infinite;`;
 }
 
-function generateRandomColors(num) {
-    const colors = [];
-    for (let i = 0; i < num; i++) {
-        colors.push(`#${Math.floor(Math.random() * 16777215).toString(16).padStart(6, '0')}`);
-    }
-    return colors;
+function generatePresetColors() {
+    const presetColors = [
+        ['#fcb045', '#fd1d1d', '#833ab4'],
+        ['#00c6ff', '#0072ff'],
+        ['#f77062', '#fe5196'],
+        ['#ff5f6d', '#ffc371'],
+        ['#43e97b', '#38f9d7'],
+        ['#30cfd0', '#330867']
+    ];
+    const randomIndex = Math.floor(Math.random() * presetColors.length);
+    return presetColors[randomIndex];
 }

styles.css

@@ -17,8 +17,8 @@ body, html {
 
 h1 {
     font-size: 3rem;
-    color: #00ffcc;
-    text-shadow: 0 0 10px #00ffcc, 0 0 20px #00ffcc, 0 0 30px #00ffcc, 0 0 40px #00ffcc;
+    color: #ff0055;
+    text-shadow: 0 0 10px #ff0055, 0 0 20px #ff0055, 0 0 30px #ff0055, 0 0 40px #ff0055;
 }
 
 #generateBtn {
@@ -27,14 +27,14 @@ h1 {
     font-size: 18px;
     cursor: pointer;
     background-color: #333;
-    border: 2px solid #00ffcc;
-    color: #00ffcc;
+    border: 2px solid #ff0055;
+    color: #ff0055;
     transition: background-color 0.3s, color 0.3s, border 0.3s;
-    text-shadow: 0 0 10px #00ffcc;
+    text-shadow: 0 0 10px #ff0055;
 }
 
 #generateBtn:hover {
-    background-color: #00ffcc;
+    background-color: #ff0055;
     color: #0d0d0d;
     border: 2px solid #0d0d0d;
 }
@@ -45,20 +45,20 @@ h1 {
     margin: 20px 0;
     background-size: 400% 400%;
     animation: gradientAnimation 15s ease infinite;
-    border: 2px solid #00ffcc;
-    box-shadow: 0 0 20px #00ffcc;
+    border: 2px solid #ff0055;
+    box-shadow: 0 0 20px #ff0055;
 }
 
 textarea {
     width: 100%;
     height: 100px;
     background: #222;
-    color: #00ffcc;
-    border: 2px solid #00ffcc;
+    color: #ff0055;
+    border: 2px solid #ff0055;
     padding: 10px;
     font-size: 16px;
     resize: none;
-    box-shadow: 0 0 10px #00ffcc;
+    box-shadow: 0 0 10px #ff0055;
 }
 
 @keyframes gradientAnimation {