UI/UX | AI web app development

AI Color Palette Generator

We rebuilt and expanded this AI-powered colour palette generator, which is used by more than 800,000 designers and digital artists worldwide. The app helps create colour schemes, extract colours from images, check colour contrast and and access other practical design tools. The platform was redeveloped using Nuxt.js, MySQL and the OpenAI API.
Platforms
Web
Technologies
Nuxt.js, OpenAI API, MySQL
UI/UX | AI web app development

AI web app development

Our team rebuilt ColorMagic.app and introduced new tools and features to the existing AI colour palette generator. The web application turns any keyword, brand name, image and hex code into a matching colour scheme within seconds. Since its launch, users have generated generated over 4 million palettes, and the platform has grown to serve more than 800,000 designers worldwide.

ColorMagic.app is an AI colour palette generator. Users can enter a theme, upload an image or provide a hex code to create harmonious colour combinations, complete with CSS, gradients and downloadable swatches.

The platform is designed for both digital artists and people without design experience. It therefore needed to be visually engaging, easy to use and accessible across desktop and mobile devices, and discoverable in search results. With millions of colour palettes, server-side rendering was used to support fast page loading and effective SEO.

Web development services for an AI SaaS product

Our project manager, UI/UX designer and software engineers delivered the complete redevelopment of the application and introduced new functionality, including:

  • Product and web app architecture
  • OpenAI API integration and prompt engineering
  • UI/UX design for the colour generator, palette pages and supporting tools
  • Front-end and back-end development using Nuxt.js
  • Database redesign for palettes, user accounts and saved favourites
  • Image-based colour extraction
  • Colour contrast and accessibility tools
  • Server-side rendering
  • Responsive development for desktop and mobile
  • SEO optimisation
  • Project management and delivery.

Tech stack for an AI colour palette generator

  • Framework: Nuxt.js supports server-side rendering, responsive user interfaces and fast page delivery across the platform’s palette and design-tool pages.
  • AI integration: OpenAI API generates palettes from user prompts. Prompt design, response validation and caching help produce reliable results while managing performance and API costs.
  • Database: MySQL stores generated palettes, user accounts, saved favourites and application data.

Together, Nuxt.js, OpenAI and MySQL stack helped us to redevelop the application, launch new features and improve its performance and search visibility.

AI web app features

This platform includes:

  • AI colour palette generation from keywords, brand names or hex codes
  • Colour extraction from uploaded images and photos
  • CSS gradient generator with copy-ready code
  • A colour mixer for blending and adjusting colours
  • A random colour generator
  • Colour contrast checking
  • User accounts and saved favourites
  • Palette downloads as PNG files
  • Copy-ready CSS and hex values
  • A searchable library of curated colour palettes
  • Responsive UI/UX for desktop and mobile
  • Server-side rendered pages optimised for SEO.

Hire developers for your AI-powered web app

Planning to add AI features to your product or build a new AI-powered SaaS platform? Our developers have practical experience with Vue.js and Nuxt.js development and OpenAI API integration. We can help you plan the architecture, design the user experience, integrate AI functionality and develop a fast, scalable and SEO-friendly web application.