Color Palette Inspiration with Adobe Kuler

Posted on by

Share Button

Adobe Kuler is a free online tool for developing color palettes. It is primarily geared towards graphic designers, but just about anyone can use it to create a fabulous color palette quickly and easily. In this tutorial I’ll show you how to put together a quick color palette.

adobe_kuler

Adobe Kuler

When you first arrive at Adobe Kuler it is a bit intimidating. A color wheel sits on the screen with absolutely no instructions on what to do with it. That’s where this tutorial comes in.

To get started, click on Explore on the top navigation menu.

kuler_explore

By default the settings for Explore are a random selection of color palettes that were popular over the last month. I love browsing through these for inspiration, but most people prefer a more focused search. However, if you don’t know even what color you want to start with, browsing is a great idea.

kuler_explore_random

Focused Color Palette Search

If you already have at least one color in mind the search tool will help you expand the palette. The palette that we’ll be creating today is great for posters or websites, places where you want more than just one or two colors.

In the search box enter a color, in this example, blue. The search engine doesn’t do well with hex values, so you are going to get the best results by entering a general color name.

Note: If you are searching for a color with variations of spelling, you may want to search for all variations of the name. For example, I’d search for both grey and gray.

kuler_search

Your search will return plenty of results. Kuler uses infinite scrolling, so as you scroll down the page it will load more results.

Typically when creating a color palette you want to look for a few categories of colors:

  • Blending colors – These are colors which are similar in tone to the color you are starting with. These are typically great for background elements.
  • Accent colors – These are colors that complement your chosen color nicely. They stand out some, but don’t grab your attention. They are great to highlight features.
  • Call to action colors – These colors contrast your chosen color. They leap out at you and say “look at me”. These will be your focus elements on your design piece.

blue_search

I suggest finding 5-10 color palettes during your initial research stage. Once you find a palette that is interesting, hover your mouse over it. You will see 5 options.

  • Info – Provides general information on the color palette.
  • Edit – This allows you to view RGB and HEX values for the color palette.
  • Copy Link – This copies a link to the general information on the color palette.
  • Download – Allows you to download the palette.
  • Favorite – Adds the palette to your favorites.

Note: To download or favorite palettes you must be logged in with an Adobe ID. Registration is free and pretty quick.

Additional Note: On the logged in screens (My Themes & Favorites) you may need to reload the page a couple of times for Kuler’s database to catch up to your latest action. Yes, it’s moody like a real person.

blue_choice

Copy Link is great if you are working with a designer and want to send them colors that you like.

Color Palette Info

When you click on Info you will see a larger version of your color palette and some options. These options include the same options from when you hovered your mouse over them (minus of course info since you are on the info page).

blue_info

Color Palette Edit

On the Edit screen you will see more information about the colors including their RGB and HEX values. This is handy since you need the exact values to duplicate the colors.

Click on the color swatch of any of the 5 colors to edit or copy the color details. There are four sliders available for tweaking the color. The first three are red, green and blue color values. The last is how light or dark the color is. You can also grab color dot on the color wheel and drag it around.

blue_edit

Favorites

If you are logged into Kuler you can favorite color palettes. Following our example I have favorited 10 color palettes from my search of “blue”.

To view the color palettes that you have favorited go to “My Themes” in the top navigation menu and then selecting “My Favorites”.

favorites

Developing The Palette

Now that I have a few colors favorited I will pick out my three types of colors: blending; accent; and call to action.

For this I will open two browser windows side by side. In my left window I will have my favorites on Kuler open. In my right window I will go to Kuler’s main screen “Create”.

I generally start with the call to action colors. First, I will look at the 10 color palettes I have favorited and see which colors leap out at me. I see orange, two shades of red, yellow, and a bright green.

I select “Edit” for each palette that has a color I want. I click on the color I’m going to use and copy the HEX value.

blue_edit

In the right browser window I have the “Create” page. I will click on Color Rule and select “Custom”. Using a custom rule will allow me to enter any values I want into the 5 color slots.

I click on the first color square and paste the HEX value that I copied. I’ll fill in the other 4 colors by selecting each of the favorited color palettes in the left browser window.

When done, I click on Save in the right browser window. This will save the color palette to “My Themes”.

create_palette

Repeat the process of creating a new custom color palette for each of the 3 types of palettes. Now we have a finished palette of blending colors, accent colors, and call to action colors.

final_palette

There is some additional information on colors from KissMetrics. You might be interested in Color Psychology, Gender and Color, or How Colors Affect Conversions.

Conclusion

Graphic designers use Adobe Kuler and tools like it to develop beautiful palettes, and now you can too! Just use the simple steps in this tutorial and you will be on your way to putting together your own color palettes. This is also great if you are working with a designer and can show them exactly which colors resonate with you.

Share Button

Leave a Reply

Your email address will not be published. Required fields are marked *