Announcing Flows – User onboarding for modern SaaS →

Color generator

The color generator helps you find harmonious color combinations tailored for UI design.

Atmos color generator

Generating colors

There are two ways to generate colors:

  1. Clicking the Generate button
  2. Pressing Space on your keyboard

Every time you generate, all colors that are not locked are replaced with a new batch of colors.

Ways how to generate colors in Atmos

Adding brand colors

To add another brand color, click on the floating plus button on the right side of the screen. You can generate up to 8 brand colors at one time.

How to add brand color to color generator

Changing generator modes

Next to the Generate button you will find 3 buttons. These buttons change how the generator creates colors:

  • Random - the generator creates random harmonious colors
  • Meaning - the generator creates colors based on selected emotion or industry. These meanings are based on color theory.
  • Color family - the generator creates colors that fall into the selected color family

Saving colors

When you like a color there are two options to save it:

  1. Locking it in the generator
  2. Adding it to your palette

Each has a different impact on the color generator.

Locking a color

When you lock a color, it will always stay in the color generator and the generator will try to find harmonious colors related to the locked color.

Sometimes no harmonious colors can be created. That usually happens when multiple colors are locked. In this case the color generator will ignore all locked colors when creating new colors.

You can also lock all colors by clicking the Lock all button in the top right corner.

Atmos color generator

Adding color to your palette

To permanently save a color add it to your palette by clicking on the plus icon while hovering over the color.

Colors in the palette don't have any effect on the generator. For that, you have to lock the color in the generator.

You can also add all colors to the palette by clicking the Add all to palette button in the top right corner.

How to save a color in the color generator

Edit a color

To edit a color, click on the edit icon on the right while hovering over the color. This will open the color editor with HEX, RGB, LCH, and HSL color pickers.

How to edit a color in the color generator

Copy color

To copy a color, click on the HEX code below its name. This will copy the code to your clipboard.

How to copy a color HEX code in the color generator

Last updated December 2022

Create your palette for
free in minutes

Whether you're new to color palettes, or a pro looking for advanced tools, we'll have you set up and ready to create your best palette in minutes.

Get started for free