Colour Detector Camera PWA with React + Camera API + TailwindCSS
Mahmudur Rahman

Mahmudur Rahman @mahmud-r-farhan

About: Full Stack Developer

Location:
Bangladesh
Joined:
Sep 24, 2024

Colour Detector Camera PWA with React + Camera API + TailwindCSS

Publish Date: May 1
0 0

Hey, devs! 👋

I recently built a Color Detector PWA that uses your device's camera to detect colors in real-time.

🔗 Live Demo: https://color-detector-app.vercel.app/

💻 Stack: React, TailwindCSS, Framer Motion, Camera API

🚀 Features:

  • 📷 Access your camera to detect colors

  • 🎨 Shows HEX and RGB values of the color in focus

  • 💾 Works offline (PWA support)

  • ⚡ Smooth animations with Framer Motion

  • 📱 Responsive and mobile-first

📚 Why I built this:

I wanted to experiment with modern web APIs like getUserMedia and wrap it all in a performant, installable PWA with a clean UI. This was also a great excuse to polish my React and animation skills!

🛠️ What’s next:

  • Color palette history

  • Copy-to-clipboard feature

  • Better browser fallback support

  • Accessibility improvements

I Would love to hear your feedback!

Let me know what features you'd like to see, or feel free to contribute!

🌐 Live App

📂 GitHub Repo

Follow for more!

Comments 0 total

    Add comment