Skip to main content

Notes on Color #6: Creating a Zorn Palette

Update: the palette for Krita is available here.

For beginners, limited palette is a useful tool for learning to use colors. Among many of those, the Zorn palette, used by Anders Zorn, seems popular in some ateliers.

There are a few variations of the Zorn palette. The version that I'm learning consists of the following base colors:

  • Ivory Black
  • Permanent White or Titanium White
  • Yellow Ochre
  • Cadmium Red Light
When painting, you are only allowed to obtain colors by mixing these base cases. Depsite of its simplicity, the palette is surprisingly powerful, especially for portrait painting.

Since I'm learning both painting and color theories, I find it interesting to make a digital version.

Mixing Paints

The process of mixing paints is rather complicated. It is somewhere between additive-average and subtractive. However the situation is simple because the Black and White has very few chroma, and the Red and Yellow are very close in the color space.

In this case we could get quite good estimation of the mixed color by taking (weighted) geoemtric means of the spectral reflectance curves. More details can be found here. A more realistic result can be obtained with ColorMixingTools. Here is a comparison, they look close enough.
Spectral Reflection Curves of Cadmium Red, Yellow Orche and their 1:1 geometric mean.

Mixing Cadmium Red and Yellow Orche using drop2color.


Then I plotted mixes of pairs of base colors in XYZ and CAM16UCS.

Mix of pairs of base colors in XYZ

Mix of pairs of base colors in CAM16UCS

Interestingly, the edges look quite straight. This means we could even simply use linear combination as a good estimate. Note that linear combinations does make sense in term of mixing lights, and it is much easier to compute.

Computing the Zorn Color Space

Now the task is to compute all linear combinations of the colors. More accurately, we want all weighted arithmetic means of these colors. This is naturally the volume enclosed by the convex hull of the 4 colors.

The convex hull may be computed in XYZ or a linear RGB space. Note that since XYZ and linear RGB are just linear tranformation of each other, the result color space are essentially the same.

To me it was not trivial how to arrange the color space into a palette. Note that the Zorn color space is a 3d volume, but a palette is ususally 1d or 2d. After some research I decided to put the volume in CAM16UCS, then take slices of the volume at different luma's, which fit the way I intend to use it in painting.

At last, just for fun, I also computed the convext hull in CAM16UCS for comparison, which may or may not make any sense.

Here's the result:


While both versions look simliar, the XYZ version seems better.


Producing the Palette

Now the palette can be obtained by taking samples of the volume at grid points. Here are two slices.

The Zorn Palette at J=35   
The Zorn Palette at J=65

I was also able to export the palette for Krita.

Zorn Palette for Krita.

Final Thoughts

While it is merely a quick hack with random decisions here and there. I reckon this palette would serve well in my learning of the palette.

The Zorn palette may be viewed as a simple specific version of color gamut masks, which I plan to study further. In fact I do have questions and complaints about popular implementations of gamut masks. For example, common implementations involve:
  • The HSV/HSL/HSY color wheel
  • A regular, fixed shape on the color wheel, regardless of the value.
However I don't find good color/math theories supporting these choices. As shown above, I expect the shape of the mask to be irregular and changing at different values.

On the other hand, probably it doesn't matter at all. After all this is merely a guide for artists. It is up to the artists to make decisions based on their knowledge and styles.

Comments

Drayldan said…
Hi, very interesting notes on Zorn palette, etc. Could you share your eady-made palette files for Krita here? ;)
Lu Wang said…
Sure. Here you go: https://github.com/coolwanglu/Zorn-Palette-For-Krita

Popular posts from this blog

Determine Perspective Lines With Off-page Vanishing Point

In perspective drawing, a vanishing point represents a group of parallel lines, in other words, a direction. For any point on the paper, if we want a line towards the same direction (in the 3d space), we simply draw a line through it and the vanishing point. But sometimes the vanishing point is too far away, such that it is outside the paper/canvas. In this example, we have a point P and two perspective lines L1 and L2. The vanishing point VP is naturally the intersection of L1 and L2. The task is to draw a line through P and VP, without having VP on the paper. I am aware of a few traditional solutions: 1. Use extra pieces of paper such that we can extend L1 and L2 until we see VP. 2. Draw everything in a smaller scale, such that we can see both P and VP on the paper. Draw the line and scale everything back. 3. Draw a perspective grid using the Brewer Method. #1 and #2 might be quite practical. #3 may not guarantee a solution, unless we can measure distances/p...

[转] UTF-8 and Unicode FAQ for Unix/Linux

这几天,这个东西把我搞得很头疼 而且这篇文章好像太大了,blogger自己的发布系统不能发 只好用mail了 //原文 http://www.cl.cam.ac.uk/~mgk25/unicode.html UTF-8 and Unicode FAQ for Unix/Linux by Markus Kuhn This text is a very comprehensive one-stop information resource on how you can use Unicode/UTF-8 on POSIX systems (Linux, Unix). You will find here both introductory information for every user, as well as detailed references for the experienced developer. Unicode has started to replace ASCII, ISO 8859 and EUC at all levels. It enables users to handle not only practically any script and language used on this planet, it also supports a comprehensive set of mathematical and technical symbols to simplify scientific information exchange. With the UTF-8 encoding, Unicode can be used in a convenient and backwards compatible way in environments that were designed entirely around ASCII, like Unix. UTF-8 is the way in which Unicode is used under Unix, Linux, and similar systems. It is now time to make sure that you are well familiar ...

Moving Items Along Bezier Curves with CSS Animation (Part 2: Time Warp)

This is a follow-up of my earlier article.  I realized that there is another way of achieving the same effect. This article has lots of nice examples and explanations, the basic idea is to make very simple @keyframe rules, usually just a linear movement, then use timing function to distort the time, such that the motion path becomes the desired curve. I'd like to call it the "time warp" hack. Demo See the Pen Interactive cubic Bezier curve + CSS animation by Lu Wang ( @coolwanglu ) on CodePen . How does it work? Recall that a cubic Bezier curve is defined by this formula : \[B(t) = (1-t)^3P_0+3(1-t)^2tP_1+3(1-t)t^2P_2+t^3P_3,\ 0 \le t \le 1.\] In the 2D case, \(B(t)\) has two coordinates, \(x(t)\) and \(y(t)\). Define \(x_i\) to the be x coordinate of \(P_i\), then we have: \[x(t) = (1-t)^3x_0+3(1-t)^2tx_1+3(1-t)t^2x_2+t^3x_3,\ 0 \le t \le 1.\] So, for our animated element, we want to make sure that the x coordiante (i.e. the "left" CSS property) is \(...