🎨 Palette

Upload an image, get its top 10 colors as HEX codes.

Palette is a Flask web app that analyzes any uploaded image and extracts its 10 most common colors, displayed as clickable swatch cards with their HEX codes. All the color analysis happens with Numpy pixel counting, no external API, no machine learning model, just fast, straightforward array math.

---

✨ Features

• 📁 Drag-and-drop or click-to-upload image interface
• 🎨 Top 10 dominant colors, extracted via Numpy pixel frequency analysis
• 🟩 Swatch grid display — each color shown as a card with its live color swatch and HEX code
• 📋 Click-to-select HEX codes (user-select: all) for instant copying
• 🔁 Session-based results — the analyzed image's colors persist through a redirect, then clear automatically afterward
• 🎨 Minimal dark-themed interface

---

🛠️ Tech Stack

• Python 3 + Flask — routing, file uploads, and session handling
• Pillow (PIL) — opening and resizing the uploaded image
• NumPy — counting and ranking pixel colors by frequency
• HTML5 / CSS3 — custom-styled frontend, no CSS framework
• Google Fonts — JetBrains Mono (headings) & Inter (body)

---

📁 Project Structure

palette/
├── app.py              # Flask application (upload handling + color analysis)
├── uploads/            # Auto-created folder where uploaded images are saved
├── templates/
│   └── index.html      # Main page template (Jinja2)
├── static/
│   └── style.css       # Stylesheet
└── README.md

Note: The uploads/ folder is created automatically the first time the app runs (os.makedirs(UPLOAD_FOLDER, exist_ok=True)), so it doesn't need to exist in the repo beforehand.

---

▶️ Getting Started

Prerequisites

pip install flask pillow numpy

Running the App

git clone https://github.com/rhitamcoder/palette.git

cd palette

python app.py

The app will start in debug mode at http://127.0.0.1:5000/. Upload an image, click Find Colors, and see its top 10 dominant colors appear below.

---

🧠 How It Works

1. Upload: the image is saved to the uploads/ folder via the /analyze POST route
2. Resize: the image is downscaled to 150×150 pixels for fast analysis, since exact color accuracy doesn't require full resolution
3. Flatten: the image is converted into a flat array of RGB pixel values using NumPy
4. Count: np.unique() identifies every distinct color and how many times it appears
5. Rank: the 10 most frequent colors are selected and converted to HEX format
6. Display: the HEX codes are stored in the session, and the home page reads and clears them on render, so results show once per upload

---

🔐 Security Note

app.py sets app.secret_key = "image-hex", a hardcoded value used only to sign Flask's session cookie (no external API or account is tied to this key). It's fine for local use and demonstration purposes, but if this app were ever deployed publicly, this should be replaced with a securely generated random key loaded from an environment variable.

---

📝 License

This project is licensed under the MIT License — see the LICENSE file for details.