Charles Poynton provides an excellent set of resources on his website regarding color technology and color terminology.
Color depth and high dynamic range color
Color depth (or bit depth) is the number of bits per channel (bpc) used to represent the color of a pixel. The more bits for each RGB channel (red, green, and blue), the more colors each pixel can represent.
In After Effects, you can work in 8-bpc, 16-bpc, or 32-bpc color.
In addition to color bit depth, a separate characteristic of the numbers used to represent pixel values is whether the numbers are integers or floating-point numbers. Floating-point numbers can represent a much larger range of numbers with the same number of bits. In After Effects, 32-bpc pixel values are floating-point values.
8-bpc pixels can have values for each color channel from 0 (black) to 255 (pure, saturated color). 16-bpc pixels can have values for each color channel from 0 (black) to 32,768 (pure, saturated color). If all three color channels have the maximum, pure-color value, the result is white. 32-bpc pixels can have values under 0.0 and values over 1.0 (pure, saturated color), so 32-bpc color in After Effects is also high dynamic range (HDR) color. HDR values can be much brighter than white.
The color depth setting for a project determines the bit depth for color values throughout a project.
To set the color depth for a project, do one of the following:
Alt-click (Windows) or Option-click (Mac OS) the Project Settings button in the Project panel.
Choose File > Project Settings or click the Project Settings button in the Project panel, and choose a color depth from the Depth menu.
To change the format in which color values are shown in the Info panel and in some effect controls, choose an option such as Percent or Web from the Info panel menu. Choosing Auto Color Display automatically switches between 8 bpc, 16 bpc, and 32 bpc, depending on the color depth of the project.
Though many effects can work with all color depths, some effects work only with lower color depths. You can set the Effects & Presets panel to only show effects that work with your current project color depth. (See Effects & Presets panel.)
This video from the After Effects CS5: Learn By Video series provides an introduction to color channels and color bit depth, and it shows how choosing the right color bit depth can often eliminate banding in gradients.
The dynamic range (ratio between dark and bright regions) in the physical world far exceeds the range of human vision and of images that are printed on paper or displayed on a monitor. Low dynamic range 8-bpc and 16-bpc color values can represent RGB levels only from black to white, which is only a small segment of the dynamic range in the real world.
High dynamic range (HDR), 32-bpc floating-point color values can represent brightness levels much greater than white, including objects as bright as a flame or the Sun.
Set the project color depth to 32 bpc to work with HDR footage or to work with over-range values—values above 1.0 (white) that aren’t supported in 8- or 16-bpc mode. Over-range values preserve the intensity of highlights, which is as useful for synthetic effects such as lights, blurs, and glows as it is for working with HDR footage. The headroom provided by working in 32 bpc prevents many kinds of data loss during operations such as color correction and color profile conversion.
Even if you’re using 8-bpc footage and are creating movies in 8-bpc formats, you can obtain better results by having the project color depth set to 16 bpc or 32 bpc. Working in a higher bit depth provides higher precision for calculations and greatly reduces quantization artifacts, such as banding in gradients.
Merely increasing the color depth within a project won’t eliminate gradients if the output format has a low bit depth. To mitigate banding, After Effects introduces dithering of colors when the colors are converted to 8-bpc colors, including when rendering and exporting to an 8-bpc format. This dithering is not introduced for previews. To force dithering for previews, apply an 8-bpc effect that does nothing—such as the Arithmetic effect with the default values—to an adjustment layer.
Because 16-bpc frames use half the memory of 32-bpc frames, rendering previews in a 16-bpc project is faster, and RAM previews can be longer than in a 32-bpc project. 8-bpc frames use even less memory, but the tradeoff between quality and performance can be obvious in some images at a project color depth of 8 bpc.
You can use the HDR Compander effect to compress the dynamic range of a layer with an HDR footage item as its source. In this way, you can use tools that don’t support HDR color, such as 8-bpc and 16-bit effects. When you’re done, use the HDR Compander to undo the dynamic range compression. The HDR Highlight Compression effect lets you compress the highlight values in an HDR image so that they fall within the value range of a low dynamic range image.
Because we can see only a subset of the luminance values in a real-world scene in an HDR image on a monitor, it is sometimes necessary to adjust the exposure—the amount of light captured in an image—when working with an HDR image. Adjusting the exposure of an HDR image is like adjusting the exposure when photographing a scene in the real world, allowing you to bring detail out of very dark areas or very bright areas. You can use the Exposure effect to change the color values of a layer for final output, or you can just adjust the exposure in a specific viewer for preview purposes.
Because some operations—including glows, blurs, and some blending modes—behave differently in 32-bpc mode as compared with 8-bpc or 16-bpc mode, your composition may look significantly different when you switch between high dynamic range and low dynamic range project settings.
Jonas Hummelstrand provides a collection of resources for understanding and using HDR color in After Effects on his General Specialist website.
Chris Meyer explains what floating-point, 32-bpc, HDR color is good for in a video overview on the Lynda.com website.
Kert Gartner provides some visual examples and a brief explanation on his VFX Haiku website that demonstrate the benefits of working with 32-bpc color.
Andrew Kramer provides a video tutorial on his Video Copilot website in which he demonstrates the advantages of using 32-bpc color with motion blur.
On his fnord website, Brendan Bolles explains how to use the Color Profile Converter effect and film color profiles to adjust colors and perform tone mapping to make an HDR image appear as if it were shot on motion picture film.
Select a color or edit a gradient
In many contexts, you can click an eyedropper button to activate the eyedropper tool, or you can click a color swatch to open a color picker. If you use the Adobe Color Picker, you can also activate the eyedropper from the Adobe Color Picker dialog box.
If you click a gradient swatch (Linear Gradient or Fill Gradient) for a stroke or fill in a shape layer, the Adobe Color Picker opens as the Gradient Editor, with additional controls for editing gradients included at the top of the dialog box. You can also click Edit Gradient in the Timeline panel to open the Gradient Editor.
Andrew Devis shows how to modify gradient fills and strokes for shape layers, plus other options, in a video on the Creative COW website.
The sampleImage expression method is another way to sample color values. Use this method to use color values of specific pixels as input into an expression. (See Layer General attributes and methods (expression reference).)
Jeff Almasol provides the PickerSwitcher script on his redefinery website, which toggles the Use System Color Picker setting. Use this script when you prefer to use the Adobe Color Picker for certain tasks, but the operating system color picker for others, and want a quick way to change this setting.
To select the color of a single pixel, click the pixel.
To sample the color average of a 5-pixel-by-5-pixel area, Ctrl-click (Windows) or Command-click (Mac OS) the area.
When sampling from within the composition frame of the Composition panel, the eyedropper by default ignores the composition background color and samples only straight color channels. To sample color channels premultiplied with the composition background color, press Shift as you click with the eyedropper. Shift-clicking with the eyedropper samples colors as they appear in the composition frame in the Composition panel.
Press the Escape key to deactivate the eyedropper.
- (Optional) To prevent panels from updating with the results of your color selection until you accept the color by clicking OK, deselect Preview in the Color Picker dialog box. The Preview option is not available in all contexts.
Selecting Preview is convenient for seeing the results of your color selections before you commit them, but it can also decrease performance, as new images are rendered for the preview in the Composition panel or Layer panel.
Displays all hues in the color slider. Selecting a hue in the color slider displays the saturation and brightness range of the selected hue in the color spectrum, with the saturation increasing from left to right and brightness increasing from bottom to top.
Displays all hues in the color spectrum with their maximum brightness at the top of the color spectrum, decreasing to their minimum at the bottom. The color slider displays the color that’s selected in the color spectrum with its maximum saturation at the top of the slider and its minimum saturation at the bottom.
B (in the HSB section)
Displays all hues in the color spectrum with their maximum saturation at the top of the color spectrum, decreasing to their minimum saturation at the bottom. The color slider displays the color that’s selected in the color spectrum with its maximum brightness at the top of the slider and its minimum brightness at the bottom.
Displays the red color component in the color slider with its maximum brightness at the top of the slider and its minimum brightness at the bottom. When the color slider is set to minimum brightness, the color spectrum displays colors created by the green and blue color components. Using the color slider to increase the red brightness mixes more red into the colors displayed in the color spectrum.
Displays the green color component in the color slider with its maximum brightness at the top of the slider and its minimum brightness at the bottom. When the color slider is set to minimum brightness, the color spectrum displays colors created by the red and blue color components. Using the color slider to increase the green brightness mixes more green into the colors displayed in the color spectrum.
B (in the RGB section)
Displays the blue color component in the color slider with its maximum brightness at the top of the slider and its minimum brightness at the bottom. When the color slider is set to minimum brightness, the color spectrum displays colors created by the green and red color components. Using the color slider to increase the blue brightness mixes more blue into the colors displayed in the color spectrum.
- Drag the triangles along the color slider, or click inside the color slider to adjust the colors displayed in the color spectrum.
- Click or drag inside the large square color spectrum to select a color. A circular marker indicates the location of the color in the color spectrum.
As you adjust the color using the color slider and color spectrum, the numeric values change to indicate the new color. The top rectangle to the right of the color slider displays the new color; the bottom rectangle displays the original color. Click the bottom rectangle to reset the color to the original color.
For HSB, specify hue (H) as an angle, from 0° to 360°, that corresponds to a location on the color wheel. Specify saturation (S) and brightness (B) as percentages (0–100).
For RGB, specify component values. You can set colors to under-range and over-range values (outside the range 0.0–1.0) in an HDR project.
For #, enter a color value in hexadecimal form. This color format is common in web workflows.
A gradient is defined by color stops and opacity stops. Each stop has a location along the gradient and a value for color or opacity. The values between stops are interpolated. By default, the interpolation is linear, but you can drag the opacity midpoint or color midpoint between two stops to alter the interpolation.
- To add a color stop or opacity stop, click below or above the gradient bar in the Gradient Editor dialog box.
- To remove a stop, drag it away from the gradient bar, or select the stop and click Delete.
- To edit the value of a stop, select it and adjust the Opacity value or use the Adobe Color Picker controls beneath the gradient editor controls.
- To choose a gradient type, click the Linear Gradient or Radial Gradient button in the upper-left corner of the Gradient Editor dialog box.
Use the Style property to choose a gradient type for the Gradient Overlay layer style.
Choose Window > Extensions > Adobe Color Themes to open this panel. Adobe Color Themes panel was previously named Adobe Kuler.
Adobe provides the Swatch You Want script in a package of scripts for After Effects on the After Effects Exchange on the Adobe website. The Swatch You Want script imports and converts Adobe Swatch Exchange (.ase) files for use in After Effects.
Jerzy Drozda, Jr. provides a video tutorial and example project on his Maltaannon website that show how to copy and paste from the Adobe Color desktop application to bring color swatches into After Effects.
Mathias Möhl provides a script on the After Effects Scripts website with which you can load and use Kuler color themes. Mathias also provides a tutorial on the AETUTS+ website that demonstrate how to use Color with After Effects.
Jorrit Schulte provides a tutorial on the AETUTS+ website that demonstrates how to make an animation preset for importing and working with Kuler color swatches.
Color correction, color grading, and color adjustment
When you assemble a composition, you often need to adjust or correct the colors of one or more of the layers. Such adjustments can be for any of several reasons. Some examples:
You need to make it seem as if multiple footage items were shot under the same conditions so that they can be composited or edited together.
You need to adjust the colors of a shot so that it seems to have been shot at night instead of day.
You need to adjust the exposure of an image to recover detail from the over-exposed highlights.
You need to enhance one color in a shot because you will be compositing a graphic element over it with that color.
You need to restrict colors to a particular range, such as the broadcast-safe range.
The terms color correction and color grading are often used interchangeably, though the term color grading is sometimes used to refer distinctly to color adjustments made for creative purposes rather to correct problems with color. The term color correction is used in the broad, general sense in After Effects.
After Effects includes many built-in effects for color correction, including the Curves effect, the Levels effect, and other effects in the Color Correction effects category. You can also use the Apply Color LUT effect to apply the color mappings in a color lookup table for color correction purposes. (See Color Correction effects and Apply Color LUT effect.)
The Camera Raw plug-in can be used to correct and adjust still images in JPEG, TIFF, and various camera raw formats.
The Synthetic Aperture Color Finesse plug-in included with After Effects includes excellent color-correction tools. After Effects CC and CS6 include Synthetic Aperture Color Finesse 3. (See Resources for Synthetic Aperture Color Finesse.)
This article on the Adobe website collects several video tutorials and other resources for color correction and color grading in After Effects and Premiere Pro.
John Dickinson provides visual aids on his Motionworks website that illustrate how to use the Curves and Levels effects for color adjustments:
This video from After Effects: Learn By Video series shows how to combine motion tracking and rotoscoping to isolate and selectively color-correct an actor's face.
The Rebel CC animation preset is a simple, telecine-style color-correction tool for coloring or grading a movie. This animation preset uses expressions to control the Levels (Individual Controls) effect. To learn more and download the animation preset, see Stu Maschwitz's ProLost blog.
Stu Maschwitz provides a post on his ProLost blog that discusses color correcting for skin tones, with links to some resources about test setups that show various skin tones on a vectorscope.
Mark Christiansen provides tips and detailed techniques for color correction, color adjustment, and color matching in the “Color Correction in Adobe After Effects” chapter of After Effects Studio Techniques on the Peachpit Press website.
Rich Young collects tutorials and presets for bleach bypass, cross-process, and other looks in an article on the ProVideo Coalition website.
A histogram is a representation of the number of pixels at each luminance value in an image. A histogram that has nonzero values for each luminance value indicates an image that takes advantage of the full tonal range. A histogram that doesn’t use the full tonal range corresponds to a dull image that lacks contrast.
A common color-correction task is adjusting an image to spread out the pixel values more evenly from left to right on the histogram, instead of having them bunched up at one end or the other. Applying the Levels effect and adjusting its Input White and Input Black properties in the histogram is an easy and effective way to accomplish this task for many images.
Resources for Synthetic Aperture Color Finesse
The Synthetic Aperture Color Finesse plug-in included with After Effects includes excellent color-correction tools. Synthetic Aperture provides tutorials and additional information about using Color Finesse on their website.
Color Finesse installs its documentation in the plug-in’s subfolder in the Plug-ins folder. After Effects CC and CS6 include Synthetic Aperture Color Finesse 3. (See Plug-ins.)
Color models and color spaces
A color model is a way of describing color using numbers so that computers can operate on them. The color model used within After Effects is the RGB color model, in which each color is described in terms of amounts of red, green, and blue light added together to make the color. Other color models include CMYK, HSB, YUV, and XYZ.
A color space is a variant of a color model. A color space is distinguished by a gamut (range of colors), a set of primary colors (primaries), a white point, and a tone response. For example, within the RGB color model are several color spaces, including—in decreasing order of gamut size—ProPhoto RGB, Adobe RGB, sRGB IEC61966-2.1, and Apple RGB. Although each of these color spaces defines color using the same three axes (R, G, and B), their gamuts and tone response curves are different.
Though many devices use red, green, and blue components to record or express color, the components have different characteristics—for example, blue for one camera is not exactly the same as blue for another camera. Each device that records or expresses color has its own color space. When an image moves from one device to another, image colors may look different because each device interprets the RGB values in its own color space.
Color management uses color profiles to convert colors from one color space to another, so colors look the same from one device to another.
Gamma and tone response
The tone response for a color space is the relationship of light intensity to the signal that creates or records (perceives) the light.
The human visual system does not respond linearly to light. In other words, our perception of how bright a light is does not double when twice as many photons hit our eyes in a given time. Similarly, the display elements of a CRT monitor do not emit light that is twice as bright when a voltage twice as great is applied. The relationship of light intensity to signal intensity for a display device is expressed by a power function. The exponent of this power function is called gamma. In general, the relationship of light intensity to signal intensity for an input device is the inverse of the relationship for an output device, though the gamma values may differ for input and output devices to accommodate the difference between scene lighting and lighting of the viewing environment.
Moving the midtone slider (such as the Gamma control for the Levels effect) in a color-correction histogram has the same result as modifying gamma, changing the tone response curve without moving the white point. Modifying the curve in the Curves effect also modifies tone response, but not necessarily with a gamma curve.
Charles Poynton provides an excellent set of resources on his website regarding gamma and other color technology.
Raising any number to the power of 1 gives the original number as a result. A gamma of 1.0 is used to express the behavior of light in the natural world, outside the context of our nonlinear perceptual systems. A system with gamma of 1.0 is sometimes said to operate in linear light, whereas a system encoded with a gamma other than 1.0 to match the human visual system is said to be perceptual.
If you have enabled color management (by specifying a working color space), you can perform all color operations in linear light by linearizing the working color space. A linearized color space uses the same primaries and white point as the nonlinear version; the tone response curve is just made into a straight line.
Many compositing operations, such as combining colors with blending modes, benefit from being performed in a linear color space. For the most natural and realistic blending of colors, work in a linear color space. If you have not enabled color management, you can still perform blending operations using a gamma of 1.0. (See Linearize working space and enable linear blending.)
The gamma value for an entire system—from capture, through production, to display in the viewing environment—is the product of the gamma values used for each of the phases in the system. This product is not always 1.0, as it would be if the operations performed for encoding exactly matched (inverted) the operations performed for decoding. One reason for a system gamma other than 1.0 is that a difference often exists between the lighting conditions in which a scene is captured and the lighting conditions in which it is viewed. (Consider that you usually watch a movie in a dim environment, but the scenes aren’t normally shot in a dim environment.)
For example, the device gamma for an HD camera is approximately 1/1.9, and the device gamma for an HD display is approximately 2.2. Multiplying these values gives a system gamma of approximately 1.15, which is appropriate for the somewhat dim television viewing conditions of a typical living room. The system gamma for motion picture production is much higher (approximately 1.5–2.5) to accommodate the darker viewing environment of a movie theater. The gamma for the film negative is approximately 1/1.7, and the gamma for the projection film is approximately 3–4.
Color profiles are said to be scene-referred if their tone-response curves are based on the conditions in the typical scene. Color profiles are said to be output-referred if their tone-response curves are based on the conditions in the typical viewing environment.
By default when you use color management, After Effects automatically adjusts the contrast of images when converting between scene-referred color profiles and output-referred color profiles. This automatic conversion (image state adjustment) is based on the gamma values specified in the HDTV video standard.
To disable this automatic color transformation, deselect Compensate For Scene-referred Profiles in the Project Settings dialog box (File > Project Settings).
The Compensate For Scene-referred Profiles feature also exists in Adobe Photoshop CS4 and later, but this feature does not exist in other applications. To match the colors in other applications—including After Effects CS3 and earlier—disable this automatic conversion. When you open a project created in After Effects CS3 or earlier, the Compensate For Scene-referred Profiles option is deselected.
Each instance of the Color Profile Converter effect can also be set to either compensate for scene-referred profiles, not compensate for scene-referred profiles, or use the setting indicated by the project’s Compensate For Scene-referred Profiles option. (See Color Profile Converter effect.)
For additional information about the compensation for scene-referred profiles, see this blog post by Todd Kopriva and Peter Constable on the Adobe website.
Trish and Chris Meyer provide an article on the ProVideo Coalition website that adds some practical information regarding scene-referred and display-referred color profiles.
After Effects 7.0 and earlier used QuickTime codecs to decode several kinds of media, and the gamma adjustments performed by QuickTime on Windows were different from the gamma adjustments performed on Mac OS. The gamma adjustments performed by After Effects CS3 and later differ from the gamma adjustments performed by these QuickTime codecs. Gamma adjustments performed by After Effects CS3 and later on Windows are the same as gamma adjustments performed by After Effects CS3 and later on Mac OS. Also, by not using QuickTime codecs, After Effects preserves over-range values in 32-bpc projects.
Select Match Legacy After Effects QuickTime Gamma Adjustments in the Project Settings dialog box to accomplish any of the following:
Avoid color shifts when working with projects created in After Effects 7.0 or earlier
Match the colors in a project created in After Effects 7.0 or earlier
Ensure that colors in the Composition panel match colors in QuickTime player
The Match Legacy After Effects QuickTime Gamma Adjustments option is selected by default for projects created in After Effects 7.0 or earlier. You should create new projects without this option selected.