Merge pull request #17 from harith-hacky03/main

UI Enhancement for a More Professional and Premium Design Improved- hacktoberfest2024
TheOpenInnovator · Oct 17, 2024 · 8dadffa · 8dadffa
2 parents 638c9d2 + ab013cf
commit 8dadffa
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -7,12 +7,14 @@
     <title>ChromaVerse: Advanced Color Palette Generator</title>
     <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
     <link rel="stylesheet" href="style.css">
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+
 </head>
 
 <body>
     <div class="container">
         <header>
-            <h1>ChromaVerse</h1>
+            <h1 class="head">ChromaVerse</h1>
             <p>Advanced Color Palette Generator</p>
         </header>
 

diff --git a/style.css b/style.css
@@ -25,7 +25,7 @@
 }
 
 body {
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    font-family: 'Poppins', sans-serif; /* Change to Poppins */
     background-color: var(--background);
     color: var(--text);
     transition: all 0.3s ease;
@@ -62,11 +62,12 @@ h1 {
     display: flex;
     justify-content: center;
     align-items: center;
+
     margin-bottom: 2rem;
 }
 
 .color-input {
-    width: 60%;
+    width: 70%;
     padding: 0.8rem;
     font-size: 1rem;
     border: none;
@@ -75,6 +76,15 @@ h1 {
     color: var(--text);
 }
 
+.color-input::placeholder {
+    color: black; /* Customize this color */
+}
+
+/* If you're using dark mode, you can also add this */
+.dark-mode ::placeholder {
+    color: white; /* Change this to a lighter color for dark mode */
+}
+
 .generate-btn {
     padding: 0.8rem 1.5rem;
     font-size: 1rem;