Tobias Wolmar

About the Project

FrontendBackendLLM

Palette is a color palette generator developed as a hobby project. The app can generate random color palettes that users can save to their profiles. Additionally, the app features an AI chatbot that helps users find palettes that match their needs.

The app is built with Next.js using TypeScript and utilizes MongoDB to store data about users and the color palettes they have saved. It also integrates the Mistral API as an LLM to generate color palettes in the chat window.

I created the app as an exercise in working with AI and MongoDB. I recreated the design from the existing app 'Coolors,' which is a color palette generator.

Test User:

Email: sylto@gmail.com

Password: hello1234

Techstack

Snapshots

Technologies

I used React to create an interactive and dynamic user interface for my color palette generator. By building the site with reusable components, I ensured an efficient development process and a user-friendly experience.

Next.js has been the foundation for creating a fast and efficient web application. I used it to develop my color palette generator, where users can easily generate and save their own color palettes.

To manage user data and saved color palettes, I implemented MongoDB. This NoSQL database gives me the flexibility to store and retrieve data efficiently.

Mistral has been a key part of adding intelligence to my application. I integrated Mistral into the chat window so users can get help generating color palettes, providing a more intuitive experience.

With Tailwind CSS, I quickly and efficiently styled my color palette generator. This has enabled me to create a modern and responsive design that works well on all devices.

TypeScript has helped me write more robust and maintainable code. By adding type safety to JavaScript, I have reduced errors and improved the development process.

Zustand is a state management library for React. I used Zustand to manage the state in the app, allowing users to lock individual colors in palettes without losing the state when generating a new palette.