ColorMatch AI

🌟 Inspiration ColorMatch AI was born from a simple but powerful idea: most people don’t know what colors actually suit their skin tone. Inspired by fashion stylists, personal shopping assistants, and the boom of AI-powered personalization, we wanted to democratize color consultation through a mobile-first app that anyone could use — without needing a stylist or makeup expert.

We also saw how hard it is to shop confidently online in India — different lighting, models, and product displays often lead to color mismatches. That’s where ColorMatch AI steps in.

🧠 What We Learned How to use AI/ML to classify skin undertones (cool, warm, neutral) from a selfie using computer vision models.

How to design a user-friendly, mobile-first UI inspired by top apps like Pinterest, Nykaa, and Colorwise.

How to integrate shopping APIs and affiliate links from platforms like Flipkart, Ajio, Myntra, and Amazon.

The complexity of accurately analyzing skin color due to camera lighting, makeup, and filters — and how preprocessing helps.

The power of personalization — users were far more engaged when the suggestions felt tailored.

🛠️ How We Built It We used Bolt to build the entire application rapidly:

🔧 Core Features: Image Upload Block: Drag & drop your selfie.

Python Block: Process image → detect skin region → analyze average skin tone using OpenCV and a trained ONNX model.

GPT Block: Classifies undertone, recommends best shades (clothing, lipstick, accessories).

API Block: Fetches matching products from Flipkart/Myntra/Ajio using keywords + color filters.

Dashboard UI: Personalized palette, “Try This Color” looks, and shoppable outfit suggestions.

Result Tracker: Users can see their saved palette, outfit history, and compare results with friends.

💡 Design System: Primary Color: #6366F1 (Indigo)

Secondary Accent: #EC4899 (Fuchsia)

Font: Poppins (clean & modern)

Card-based layout with motion transitions

Full mobile responsiveness (Android-first)

😓 Challenges We Faced Skin Detection Accuracy: Lighting conditions drastically affect skin-tone detection. We solved this by applying histogram equalization and rejecting overexposed images.

Finding Reliable APIs: Many Indian e-commerce APIs aren’t open, so we had to simulate search-based crawling with curated affiliate links.

Bias in AI Recommendations: Some datasets were skewed toward lighter skin tones. We trained our model with diverse datasets to ensure fair output.

User Trust & Privacy: Ensuring the selfie isn’t stored was important. All processing is done temporarily in memory, and users are clearly informed.## What it does

Built With

• colorsys
• eslint
• haar-cascades
• hsv
• k-means-clustering
• lab
• lucidereact
• morphological
• netlify
• numpy
• opencv
• opencv-(cv2)
• operations
• pillow-(pil)
• postcss
• python
• react18
• scikit-learn
• talwindcss
• typescript
• vite
• webcolors
• ycrcb