Side project

Colour palette generator

Recently, I've been exploring AI development and decided to experiment with code generation tools to understand their capabilities. I built a tool for generating tints and shades for colour palettes. This project isn't associated with any business; it's just for practice.

Problem

How might designers rapidly generate shades and tints when building design systems?

Solution

I designed and built a functional tool with Figma Make that enables designers to generate colour palettes efficiently.

Approach

Before I started building the style guide, I did an audit of the entire website and found some issues.

01
Define primitive variables & define variables

Once the primitives are defined, scaleit to the typography, colour usage, borders, among others.

02
Update the existing components with the new variables

Using the new system, update the typography, buttons, tabs and so on.

new zealand tree