Clean, contrasting WordPress theme built on the foundation of Whiskey Air.

    Clean developer theme, suited for heavy modifications.

    3 columns Turbo theme, now reloaded!

    Almost magazine theme, without the hassle of administration.

One of my recent projects involved creating some sort of a color picker. While I eventually used one jQuery for this purpose, I ran into a nice illustration of hexagonal color palette.

Download the high resolution version here.

In the hexagon, or hexagonal, palette color codes are abbreviated with only a single digit representing each pair of digits. An axis for each of the three primary and three secondary RGB colors radiates out from the pure white in the center to one of the points of the hexagon on the outside edge. Each axis is terminated on the outside border with an extra color chip showing the color that “governs” that axis, so it’s easy to find the appropriate axis. For instance, locate the blue chip at the very bottom, and follow it upward. First, you cross the shades of blue on the outside, then primary blue around the middle, then tints of blue toward the center, and, finally, white in the dead center. Tones are in the outside diamonds that span each axis.

The black-outlined larger hexagon of chips halfway out on the palette displays the hues of full saturation. Inside that hexagon are the tints/pastels, and outside are the more sophisticated tones and shades, with blacks and grays showing up in a repeated pattern on the outside border. Colors evolve as we rotate around the wheel, such that red blends into orange, and orange into yellow, and yellow into green, and so forth. It now becomes effortless to pick several colors that are related in some fashion to each other, such as a red, a dark red, and a pink. The hexagon palette is more artistically intuitive than most available palettes, and it’s mathematically correct as well. Each color code transforms into the code of the adjacent colors by following a mathematical progression.

4 Responses to Hexagon Color Chart

  • Thats a very nice little color chart you found… I might even put it on my color chart website… nice find

  • Nice palette Im definitely using it to help me on my Diseño web Playa del Carmen

  • this would be perfect with the full hex code :(

    • Oh, come on, the full hex code is there.

      F63 is #FF6633, FC0 is #FFCC00, just double each character!

      Bet you didn’t know this! :P


Leave a Reply

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


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>