Pena Contents
Introduction
Control Pane
Brush Pane
Texture Pane
Effects Pane
Color Picker
  • Color Picker Introduction
  • The RGBA Color Model
  • The HSB Color Model
  • The Original Color
  • The Current Color
  • The Oval Palette Colors
  • HSB and RGBA Sliders
  • The Eyedropper
  •  
    Save/Load Pane
    Selection Pane
    Preferences Pane
    Intelligent Canvas
    Wacom Bluetooth Stylus
    Jot Bluetooth Stylus
     
    The Effects Library
    Effects Introduction
    Color Source Effects
    Procedural Source Effects
    Color Filter Effects
    Spatial Filter Effects
    Math and Logic Effects
    Special Effects
     
    Artists Gallery
    The Artist Gallery
     
    Pena Support
    Troubleshooting

       

      Previous SectionHide ContentsNext Section

      The Color Picker

      Color Picker Introduction


      There are a variety of places in Pena where the Color Picker appears. For example, tapping the Color 1 or Color 2 icons on the Control Pane will make the Color Picker appear. Likewise, some Brush and Surface Effects use the Color Picker.

      The job of the Color Picker is, as its name implies, to create Colors to use for painting.

      This next section outlines the basic functionality of the Color Picker, or you can view the video tutorial Pena Tutorial #2 - Using the Color Picker.

      The Color Picker is simple to use and is comprised of the following areas:

      • The Original and Current Colors - Two rectangles contain the Original Color and the Current Color. The Original Color is the original color you are changing. The Current Color is what it will be changed to. Initially they will both be the same colors.
      • Oval Color Palette Pads - The Original and Current Color rectangles are surrounded by 18 color ovals. This is your current color palette. By default it has a selection of colors and grey tones, but you can change them.
      • The Eyedropper - In the upper right is an Eyedropper icon. You can use this to fetch colors from the Canvas into the Color Picker.
      • The HSB and RGBA Sliders Below the Palette are seven sliders. These let you dial in an exact color by tweaking the various channel aspects.
      To dismiss the Color Picker simply tap anywhere outside of it (including on the Canvas).

       

      The RGBA Color Model


      The RGB Color Model is the model of color used by transmitted light, televisions, and even the iPad screen itself.

      RGB stands for Red, Green, and Blue. The A part stands for Alpha which we will explain in a bit.

      Each element, R, G, B, and A, is called a Channel. Thus in Pena, color is comprised of four channels.

      The values of R, G, B, and A, can range between zero and 255.

      When a channel is zero, it is turned off and has none of that color. When a channel is 255, it is on all the way, and is fully that color.

      Thus a R,G,B of 0,0,0 would be black. No red, no green, and no blue.

      Likewise, a R,G,B of 255,255,255 would be white. Full red, full green, and full blue.

      Values in between zero and 255 give you different combinations of Red, Green, and Blue for a total of over 16.2 million color combinations.

      It is easiest to visualize the RGB color model as a cube, where each corner of a cube are RGB and their combinations. The image below shows the front (left image) and back (right image) of an RGB color cube.

      As stated above, black is 0,0,0, and white is 255,255,255. If you look at the right image, and follow the line labeled R from black to the red corner, you can see that it is a smooth transition from black, through dark red, medium red, and all the way to bright red.

      Likewise with the green and blue.

      Where red and green meet you have yellow. Where red and blue meet you have magenta, and where green and blue meet you have cyan. Again, there is a transition from black to each of those in the same way as RGB. Note that CMY (Cyan, Magenta, and Yellow, are known as Secondary Colors whereas RGB are Primary Colors).

      Looking at the left cube, we can see that as all three values go towards 255, they meet at white.

      So you can easily see that any point on, or inside, the cube, will be some color or grey tone.

      The line that goes directly from black, to white, through the center of the cube, is a grey scale. Anything further from that line starts to have more and more color until the surface is fully saturated.

       

      So What About Alpha?

      The Alpha channel is the forth channel to the RGBA color. Since RGB is all we need to pick any of 16.2 million colors, what could Alpha be used for?

      Alpha is the amount of transparency of the color. Usually Alpha is 255, which means the color is fully opaque, solid.

      An Alpha of zero would mean the color is completely transparent, invisible.

      An Alpha of, say, 128 (50%) would mean the color is 50% transparent to whatever is behind it.

      Thus you have the ability to take any color and indicate how it blends with the background you are painting on, by changing the Alpha.

       

      The HSB Color Model


      Many people do not find the RGB model very intuitive, and prefer a different model named the HSB model, which stands for Hue, Saturation, and Brightness (also often called HSV where V is Value).

      Hue is the actual color, and can be thought of as a circle that starts at red, goes through the entire rainbow spectrum, and ends up back at red.

      Saturation is the amount of color. If the color has no saturation, it is black, white, or some grey. If the color is fully saturated, it is as strong as the color can get. Values in between have color somewhere inbetween the fully saturated color and the completely unsaturated color.

      Brightness (or Value) is how close to black, or how close to full hue/saturation, the color will be.

      A good way to visualize the HSB color model is with a cone:

      The very bottom of the cone is black. And the very top center of the cone is white. Saturation is the distance from the center to the edge, and Hue is the position around the disk.

      In Pena, Hue is a value from zero to 359 (as in degrees around a circle). Saturation and Brightness are both a value between 0.0 and 1.0.

       

      The Original Color


      The rectangle with the word original above it is the Original Color:

      You accessed the Color Picker by tapping on some part of Pena that defines a color. Whatever that was, the Original Color rectangle will display that color.

      You can not change the color of this rectangle. It is to remind you what the original color was before you started changing it.

      If you are modifying the color and you really want to return back to what it was before you opened the Color Picker, simply tap the Original Color rectangle. The Current Color rectangle will immediately change to the original color.

      You can also tap, hold, and drag the Original Color rectangle and drop it in different places:

      • Drop it on the Current Color - This has the same effect as just tapping the Original Color, it sets the Current Color to the Original Color.
      • Drop it on an Oval Palette Color - Dropping the Original Color on any of the Oval Palette Colors will set that Oval Palette Color to the Original Color.
      • Drop it on a HSB, or RGBA Slider - Dropping the Original Color on any of the Sliders will transfer that aspect of the Original Color to the slider. For example, if you drop the Original Color on the Hue slider, you will transfer the Original Colors Hue to the Hue Slider. Likewise if you drop the Original Color on the Green Slider, you will transfer the Green amount in the Original Color to the Green Slider.
       

      The Current Color


      The rectangle with the word current above it is the Current Color:

      When the Color Picker opens, the Current Color will match the Original Color - which is the color of whatever you selected (that caused the Color Picker to open) was set to.

      The Current Color is the color that will be used when you close the Color Picker. When you make changes to the Sliders, or tap the Oval Palette colors, or tap the Original Color, you will change the Current Color.

      If you make a mistake and want to return to the color that was set before the Color Picker opened, simply tap the Original Color rectangle.

      You can also tap, hold, and drag the Current Color rectangle and drop it in different places:

      • Drop it on an Oval Palette Color - Dropping the Current Color on any of the Oval Palette Colors will set that Oval Palette Color to the Current Color.
      • Drop it on a HSB, or RGBA Slider - Dropping the Current Color on any of the Sliders will transfer that aspect of the Current Color to the slider. For example, if you drop the Current Color on the Saturation slider, you will transfer the Current Colors Saturation to the Saturation Slider. Likewise if you drop the Current Color on the Blue Slider, you will transfer the Blue amount in the Current Color to the Blue Slider.
       

      The Oval Palette Colors


      The 18 Oval Palette Colors are places to store your favorite colors for quick reference:

      Tap any of the 18 Oval Palette Colors to set the Current Color to the color of the Oval you tapped.

      You can also tap, hold, and drag any of the Oval Palette Colors and drop it in different places:

      • Drop it on the Current Color - This has the same effect as just tapping the Oval Palette Color, it sets the Current Color to the Oval Palette Color.
      • Drop it on a HSB, or RGBA Slider - Dropping the Oval Palette Color on any of the Sliders will transfer that aspect of the Oval Palette Color to the slider. For example, if you drop the Oval Palette Color on the Brightness slider, you will transfer the Oval Palette Colors Brightness to the Brightness Slider. Likewise if you drop the Oval Palette Color on the Red Slider, you will transfer the Red amount in the Oval Palette Color to the Red Slider.
       

      HSB and RGBA Sliders


      The bottom two thirds of the Color Picker has seven sliders marked, from top to bottom: Hue, Saturation, Brightness, Red, Green, Blue, and Alpha.

      The sliders always reflect the Current Color. Changing the sliders will change the Current Color.

      You can use either the HSB or RGB sliders to change the color. Both groups of sliders are capable of generating all the possible colors. You can use both together to tweak colors in many different ways.

      Change the Hue slider to modify the basic color (or Hue) of the Current Color.

      Change the Saturation slider to modify how strong the Current Color is, from no color to full color.

      Change the Brightness slider to modify how bright (towards black or full hue/saturation) the Current Color is.

      Likewise with the RGB sliders:

      Change the Red slider to modify how much Red is in the Current Color.

      Change the Green slider to modify how much Green is in the Current Color.

      Change the Blue slider to modify how much Blue is in the Current Color.

      Finally, use the Alpha slider to specify the amount of transparency of the Current Color. The Alpha Slider, and Current Color, are backed by a black and white checkerboard. If the Alpha is set to a transparency amount, the checkerboard will show through indicating the amount of the Alpha.

      There is a white line that runs through all the sliders. This shows the current value of the slider. As you modify some sliders, the white line will change in other sliders to reflect the Current Color properly.

      To change a sliders value, tap, hold, and drag in the desired slider, left and right.

      Additionally, to the left of each slider is a text area with the numeric value of that slider. You can tap the number and enter it in via the Keyboard. Hue can go from 0 to 359 (as in degrees around a circle). Saturation and Brightness are between 0.0 and 1.0. Red, Green, Blue, and Alpha are between 0.0 and 255.0.

      To the very right of the RGBA sliders are blue hexadecimal numbers, such as 0xC2 etc. These are the RGBA values in hexadecimal, which is what is used when building web pages. These are there for reference only.

       

      The Eyedropper


      The Eyedropper icon allows you to select colors from your Canvas as your Current Color:

      Once you tap the Eyedropper icon all Panes will disappear. Tap, hold, and drag on the screen to find the color you are interested in.

      As you drag, an circle will appear to the upper left of your finger that contains the color that is under your finger. Lift your finger when you find the correct color:

      For left handed people there is an option in the Preferences Pane that will switch the eyedropper to the upper right of your finger, making it easier to use.

       

      Previous SectionHide ContentsNext Section

    pena © 2014 by David Cook
    Apple®, the Apple logo, iPad, iPad Air, iPad Mini, iPod, iPhone, and iTunes
    are trademarks of Apple Inc., registered in the U.S. and other countries.
    Wacom®, and Wacom Intuos Creative Stylus are trademarks of Wacom, registered in the U.S and other countries.