Processing Color Mixer

The Processing Color Mixer provides three ways to select colors and provides 4 or 5 ways that color can be written into a Processing program.

The specified color intensities are shown in the three circles in the upper right. Each circle shows the intensity of its color. The small circles show the colors resulting from combination of red and green, red and blue, and green and blue. The large circle in the middle shows the resulting color.

Colors can be selected in 3 different ways

  • You can move the Red, Green and Blue sliders.
  • You can click on one of the 216 so called "browser-safe colors" in left two columns of color squares.
  • You click on one of 14 examples of Processing gray shades in the right column.

The resulting color is displayed in 4 or 5 of the ways that are allowed in Processing:

  • #rrggbb where the value is in hexadecimal.
  • 0xFFrrggbb where the FF means 100% opaque
  • color(r, g b) where the colors are in decimals from 0 to 255.
  • color(r, g, b, 255) where the colors are in decimal from 0 to 255 and the final "255" means 100% opaque.
  • color(gray) can be used fro gray colors where gray is a decimal number from 0 to 255. (color(gray, 255) is also allowed

Processing allows adding the a transparency argument where 0 or 00 means completely transparent and 255 or FF means completely opaque.

The color mixer applications are written Processing.js and only requires a internet connection and that Javascript is enabled.

brinkje@plu.edu   Version: Aug. 1, 2020

HTML and CSS Color mixer
Java Color mixer
JavaFX Color mixer