Merge pull request #992 from ExPl0iT-29/main

pawangeek · web-flow · commit ece71edebd2f · 2024-10-13T21:28:59.000+05:30
Added Color Palette Generator
diff --git a/color_palette_generator/Readme.md b/color_palette_generator/Readme.md
@@ -0,0 +1,64 @@
+# Color Palette Generator
+
+## Short Description
+This is a simple web application built with Flask that generates a random color palette. Users can specify the number of colors in the palette (between 1 and 10), and the app will display the corresponding colors in a visually appealing way.
+
+## Functionality
+- Generate random color palettes with customizable color count.
+- Display color hex codes for each generated color.
+- Interactive UI to adjust the number of colors displayed.
+
+## Folder Structure
+    
+    color_palette_generator/
+    │
+    ├── app.py               # Main Flask application file
+    ├── templates/
+    │   └── index.html       # HTML template for the app
+    ├── requirements.txt     # Python dependencies file
+    └── README.md            # Instructions for the program
+    
+
+## Instructions for Each File:
+1. app.py:
+The main Flask application script, which generates random color palettes and serves them via a web interface.
+
+2. templates/index.html:
+HTML file that displays the color palette on the front end and allows the user to input the number of colors.
+
+3. requirements.txt:
+List of dependencies required to run the project.
+
+## Setup Instructions
+1. Clone the repository or download the project files.
+2. Navigate to the project folder in your terminal:
+   ```bash
+   cd color_palette_generator
+   ```
+3. Install the required dependencies using pip:
+    ```bash
+    pip install -r requirements.txt
+    ```
+4. Run the Flask app:
+    ```bash
+    python app.py
+    ```
+5. Open your browser and go to http://127.0.0.1:5000/ to use the app.
+
+
+## Detailed Explanation
+- The app.py script creates a Flask web server that serves an HTML page (index.html) where users can generate color palettes.
+- The generate_color_palette() function in app.py generates a list of random hexadecimal colors using the random module.
+- The front-end (index.html) uses a form to capture the user's input for the number of colors, and the results are displayed using a simple CSS grid for visualization.
+- Each color is displayed as a square with its corresponding hex code.
+
+## Output
+
+![Output](image.png)
+
+## Author(s)
+explooit
+https://github.com/ExPl0iT-29
+
+## Disclaimers
+- The project uses random color generation and does not guarantee aesthetically balanced palettes.
diff --git a/color_palette_generator/image.png b/color_palette_generator/image.png
diff --git a/color_palette_generator/main.py b/color_palette_generator/main.py
@@ -0,0 +1,29 @@
+from flask import Flask, render_template, request
+import random
+
+app = Flask(__name__)
+
+
+# Function to generate random color palette
+def generate_color_palette(num_colors=5):
+    """Generate a list of random hex color codes."""
+    colors = []
+    for _ in range(num_colors):
+        color = "#{:06x}".format(random.randint(0, 0xFFFFFF))
+        colors.append(color)
+    return colors
+
+
+# Home route to display the color palette generator
+@app.route('/', methods=['GET', 'POST'])
+def home():
+    if request.method == 'POST':
+        num_colors = int(request.form.get('num_colors', 5))
+        color_palette = generate_color_palette(num_colors)
+    else:
+        color_palette = generate_color_palette()
+    return render_template('index.html', color_palette=color_palette)
+
+
+if __name__ == '__main__':
+    app.run(debug=True)
diff --git a/color_palette_generator/requirements.txt b/color_palette_generator/requirements.txt
@@ -0,0 +1 @@
+Flask==2.2.3
diff --git a/color_palette_generator/templates/index.html b/color_palette_generator/templates/index.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Color Palette Generator</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            text-align: center;
+            margin-top: 50px;
+        }
+        .palette {
+            display: flex;
+            justify-content: center;
+            margin-top: 20px;
+        }
+        .color-box {
+            width: 100px;
+            height: 100px;
+            margin: 5px;
+            border-radius: 10px;
+            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+        }
+    </style>
+</head>
+<body>
+    <h1>Random Color Palette Generator</h1>
+    <form method="POST">
+        <label for="num_colors">Number of Colors:</label>
+        <input type="number" id="num_colors" name="num_colors" min="1" max="10" value="5">
+        <button type="submit">Generate Palette</button>
+    </form>
+
+    <div class="palette">
+        {% for color in color_palette %}
+        <div class="color-box" style="background-color: {{ color }};" title="{{ color }}"></div>
+        {% endfor %}
+    </div>
+</body>
+</html>
