Create brand color palettes
Learn how to generate custom color palettes for your brand or project with Khroma.
2024-11-13
Choosing the right color palette is crucial for establishing a strong brand identity. With Khroma, creating customized color palettes becomes an intuitive and enjoyable process. This tool uses AI to help you discover and generate color combinations that reflect your brand's personality and aesthetic.
Whether you're a designer, marketer, or business owner, this tutorial will guide you through the steps to create a unique and cohesive color palette for your brand, and by the end of this tutorial, you'll have a stunning color palette ready to elevate your brand's visual appeal.
Steps we’ll follow in this tutorial:
- Select sample colors
- Generate a custom color palette
- View colors in various formats
- Export or edit the palette
Step 1: Select sample colors
To get started, go to the Khroma website and click the Generate button.
.webp)
This will take you to the color selector, where you’ll select 50 colors to train the color generator algorithm for your custom color palette.
.webp)
All you have to do is scroll down the page and select the colors that fit your brand or project affinity. Khroma will keep a record of your selected colors at the top of the screen.
.webp)
Additionally, if you are overweighting the model on specific colors, Khroma will flash a toast in the bottom right corner of the screen to recommend you select specific colors. In this instance, Khroma is recommending I select more magenta, yellow, and cyan for my model.
.webp)
Step 2: Generate a custom color palette
Once you’ve selected 50 reference colors and are happy with your selection, you can click the “Start Training” button in the top right corner of the screen to train your custom color palette generator.
.webp)
It will take a few minutes for the model to be trained on your selections. Khroma will flash a loading screen with the training progress.
.webp)
Step 3: View colors in various formats
Once the model is trained, Khroma will present your new color palette in a variety of formats, starting with text on a color background.
.webp)
You can hover over any card and click the “i” icon to see details about the color pairings.
.webp)
For instance, this color pairing is Persian Indigo with Tropical Blue. Khroma provides the related Hex, RGB, and other color details on the card detail screen.
.webp)
Additionally, you can click the icons in the top right of the screen to see your colors in various presentation formats, like images, color gradients, and more.
.webp)
Step 4: Export or edit palette
If you want to edit your color palette, you can click the gear icon in the top right corner of the page and edit your training color selection to retrain your color generator.
.webp)
Once you’re happy with your color palette, you can export a JSON file with all of the color palette data at the bottom of the Settings pop-up window.
.webp)
This tutorial was created by Garrett.