Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added Color palette Generator #986

Closed
wants to merge 3 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
64 changes: 64 additions & 0 deletions color_palette_generator/Readme.md
Original file line number Diff line number Diff line change
@@ -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.
Binary file added color_palette_generator/image.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
28 changes: 28 additions & 0 deletions color_palette_generator/main.py
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
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):
colors = []
for _ in range(num_colors):
color = "#{:06x}".format(random.randint(0, 0xFFFFFF)) # Generate a random hex color
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() # Default palette with 5 colors
return render_template('index.html', color_palette=color_palette)


if __name__ == '__main__':
app.run(debug=True)
1 change: 1 addition & 0 deletions color_palette_generator/requirements.txt
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
Flask==2.2.3
41 changes: 41 additions & 0 deletions color_palette_generator/templates/index.html
Original file line number Diff line number Diff line change
@@ -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>
Loading