INDUSTRY:

Web Development

YEAR:

2025

EXPERIENCE:

Vibe Code with Claude

Cover

Color Palette Extractor (Vibe Code Claude)

Color Palette Extractor (Vibe Code Claude)

Color Palette Extractor is a free web tool designed to help designers quickly extract color schemes from any image. Whether you're working on a mood board, analyzing brand colors, or seeking inspiration from photography, this tool provides instant access to HEX and RGB codes with downloadable palette exports.

Built as a passion project to address a common pain point in the design workflow - the need for fast, accurate color extraction without switching between multiple apps or uploading files to external servers.


Challenge

Designers frequently need to extract color palettes from images for inspiration, brand analysis, or client presentations. Existing solutions often require installing additional software, uploading files to third-party servers, or time-consuming manual color picking.

The development process involved multiple iteration rounds - starting with a basic concept and evolving through continuous feedback and refinement:

- Initial concept: purple-themed interface with neon glow effects

- Iteration 1: Shifted to modern dark mode with cyan/green neon accents for a more contemporary tech aesthetic

- Iteration 2: Removed excessive glow effects and improved accessibility compliance (WCAG AA standards)

- Iteration 3: Refined spacing, contrast ratios, and visual hierarchy

- Final touches: White upload icon, optimized download feature with better spacing in exported palettes Each iteration focused on balancing visual appeal with usability, demonstrating an iterative design process that prioritizes both aesthetics and functionality.

Showcase image
Result

Developed a fully functional web application that:

- Extracts 6 dominant colors using k-means clustering algorithm

- Processes images entirely client-side for complete privacy

- Provides one-click copying of color codes to clipboard

- Generates downloadable PNG palettes for presentations and documentation

- Works seamlessly across desktop and mobile devices

- Features an accessible dark mode interface with WCAG AA compliance


Deployment & Technical Implementation:

The project was deployed using CodeSandbox, which required troubleshooting file structure issues and understanding web hosting requirements. This hands-on experience with deployment platforms provided valuable insight into the technical side of bringing design concepts to production - from local development to live, shareable URLs.

This project showcases my ability to conceptualize user needs, iterate based on feedback, and collaborate with AI tools to bring design solutions to life - demonstrating how designers can leverage modern tools to build functional products beyond traditional design deliverables.

You scrolled all the way down! Now let's create something amazing together.

Available For Work

+4915128952433

akuhareva233@gmail.com

Based on template by YUYA ©2024

Modified by NANA ©2025

You scrolled all the way down! Now let's create something amazing together.

Available For Work

+4915128952433

akuhareva233@gmail.com

Based on template by YUYA ©2024

Modified by NANA ©2025

You scrolled all the way down! Now let's create something amazing together.

Available For Work

+4915128952433

akuhareva233@gmail.com

Based on template by YUYA ©2024

Modified by NANA ©2025

Create a free website with Framer, the website builder loved by startups, designers and agencies.