If you use Cyotek's Color Palette Editor to create palettes that are displayed on community sites such as forums, then it can be handy to display a preview of the palette.

A new feature in the Palette Editor can now produce these images for you as this post briefly describes.

Creating a preview image from a colour palette automatically
Creating a preview image from a colour palette automatically

To create a preview image, open a palette, then choose Create Preview Image from the Tools menu.

Currently you can choose from the following options

  • Rows and Columns define the basic layout
  • Margins allow you to configure the space around the edges of the image
  • Spacing allows you to configure the gap between swatches in the image
  • Background lets you choose a background colour
  • Swatch Size is used to set the size of the colour swatch blocks
  • You can show a border around the swatch blocks, useful if a swatch shares the same background colour as the image itself
  • You can specify a title to be displayed
  • You can configure how swatch labels are displayed
  • For title and label text, the following options are also available
    • Font
    • Text and background colour
    • Horizontal and vertical alignment
    • Relative position to and offset from swatch colour block
    • Maximum size of the label

Then simply specify the output file name and the graphic will be saved ready for you to reuse elsewhere. Each time you export an image, the current setting are saved for future sessions.

Various options give you flexible output
Various options give you flexible output

This is currently an early version extension - there's more options I'd like to add, but it's functional now so use it and feel free to suggest improvements!

In my experiments I have found using a small pixel font with anti aliasing disabled (the font in the examples is Marke Eigenbau for the labels and Atari Classic Chunky for titles) works well, but I'd be interested in hearing of other good looking fonts.

Note: There is currently an issue where you cannot use an anti-aliased font with a transparent background. Either disable the anti-alias option, or choose a solid background colour. This is a limitation of GDI so may be difficult to work out (and using GDI+ creates ugly inconsistent text)

Finally, a few example image files generated from one of the sample palettes provided with the editor.

An example palette
An example palette
An example palette
An example palette
An example palette
An example palette

Update History

  • 2015-01-18 - First published
  • 2020-11-23 - Updated formatting

Like what you're reading? Perhaps you like to buy us a coffee?

Donate via Buy Me a Coffee

Donate via PayPal