π¨ Color Harmony Analysis Discover, analyze, and harmonize colors from any image with this powerful color analysis tool
β¨ Overview Color Harmony Analysis is an elegant, intuitive web application that lets you extract color palettes from your images, understand their emotional impact, and generate harmonious color schemes for your designs. Built with a focus on both aesthetics and functionality, this tool helps designers, artists, and color enthusiasts make informed color decisions.
π Key Features
- πΌοΈ Instant Color Extraction - Upload any PNG image and automatically extract its dominant colors
- π Color Harmony Generation - Create complementary, analogous, triadic, and monochromatic color schemes
- π Emotional Color Analysis - Understand the psychological impact of each color in your palette
- π One-Click Color Copying - Simply click on any color to copy its HEX code to your clipboard
- π Detailed Color Information - View HEX, RGB, and HSL values for each extracted color
- π± Modern Responsive Interface - Elegant animations and a user-friendly design that works on all devices
- π PDF Report Generation - Download comprehensive color analysis reports for your projects or clients
π οΈ Installation Getting started with Color Harmony Analysis is incredibly simple:
Clone this repository:
- bashCopygit clone https://github.com/harp37/ColorHarmonyAnalysis.git
Open the ColorHarmonyAnalysis.html file in your web browser:
- bashCopycd ColorHarmonyAnalysis
- open ColorHarmonyAnalysis.html
That's it! No build process, no dependencies to install locally. The application uses CDN-hosted libraries for PDF generation.
Requirements
- A modern web browser (Chrome, Firefox, Safari, or Edge)
- Internet connection (for loading external libraries)
π How to Use Analyzing an Image
- Upload an image - Drag and drop a PNG image onto the upload area or click to select a file
- Click "Analyze Colors" - The application will extract the dominant colors from your image
- Explore the results - View the extracted colors, their emotional meanings, and generated harmonies
- Copy colors - Click on any color to copy its HEX code to your clipboard
- Generate a PDF report - Click "Download PDF Report" to create a comprehensive color analysis document
Understanding the Results
- Dominant Colors - The most prominent colors from your image with their emotional associations
- Color Harmonies - Four different color harmony types based on color theory:
- Complementary - Colors opposite each other on the color wheel
- Analogous - Colors adjacent to each other on the color wheel
- Triadic - Three colors evenly spaced around the color wheel
- Monochromatic - Different shades and tints of the same color
- Palette Description - A detailed analysis of your color palette's emotional impact and potential applications
π§ How It Works Color Harmony Analysis uses sophisticated algorithms to analyze your images:
- Color Extraction - The application samples pixels from your image and groups similar colors using a quantization algorithm
- Emotional Analysis - Each color is analyzed based on its hue, saturation, and brightness to determine its psychological impact
- Harmony Generation - Color theory principles are applied to create harmonious color schemes using HSL color space transformations
- Palette Analysis - The overall palette is evaluated for characteristics like warmth, brightness, saturation, and contrast
Color Theory Background The application is built on established color theory principles:
- Color Psychology - Different colors evoke different emotions (e.g., blues are calming, reds are energetic)
- Color Harmonies - Specific relationships between colors on the color wheel create visually pleasing combinations
- HSL Color Space - Analyzing colors by hue, saturation, and lightness provides insight into their visual and emotional impact
π‘ Applications Color Harmony Analysis is perfect for:
- Designers creating cohesive brand identities or UI color schemes
- Artists exploring color palettes for their artwork
- Marketing teams developing visually consistent campaigns
- Interior designers selecting complementary color schemes
- Photographers analyzing and enhancing the color moods in their images
- Students learning about color theory and psychology
- Anyone curious about the colors in their favorite images
π€ Contributing Contributions are welcome! Here's how you can help:
- Fork the repository
- Create a feature branch: git checkout -b new-feature
- Commit your changes: git commit -am 'Add new feature'
- Push to the branch: git push origin new-feature
- Submit a pull request
π‘ Ideas for Contributions
- Add support for more image formats
- Implement more color harmony types
- Create a color accessibility checker
- Add export options for design tools
- Improve color extraction algorithms
π License This project is licensed under the MIT License - see the LICENSE file for details.
π Acknowledgments
- Color theory principles from traditional and digital design
- Inspiration from modern design tools and color Analysiss
- Built with pure JavaScript, HTML and CSS
Made with β€οΈ by Anthony Huben