How Four Color Wheels Work in Video Editing—and How I Built Them in the Browser

Four color wheels play an essential role in professional video editing, and I recently added them to my open-source browser video editor. The desktop version of the editor includes separate wheels for shadows, midtones, highlights, and global offset, while the mobile web editor maintains a simpler workflow.

A color wheel is a two-dimensional control that expresses both a color direction and adjustment strength. Moving the control point toward red adds a red bias, while moving it toward blue adds a blue bias. Moving farther from the center increases the strength, and staying in the center adds no directional color bias. This method of controlling color is often more intuitive than using three unrelated sliders for red, green, and blue.

Professional editors use multiple color wheels because a single frame can contain various luminance ranges, such as dark hair, exposed skin, a white shirt, and a bright window. Adjusting one color universally could result in unwanted changes to different regions of the image. To avoid this, color wheels are divided by luminance range.

The main areas of influence for each wheel are as follows:

- Shadows: Dark clothing, hair, night backgrounds, and unlit areas. Moving shadows toward blue or cyan can create a colder, deeper look, but too much adjustment can cause problems.

- Midtones: Skin or the main product. Adjusting midtones can help a face look more natural, but overcorrection can lead to yellow or red skin tones.

- Highlights: Bright areas like sky, windows, lamps, reflections, and white clothing. Moving highlights toward yellow or orange can create a warmer appearance, while moving them toward blue can produce a colder look. A common technique is to keep shadows slightly cool and highlights slightly warm, which adds depth and color separation.

In addition to the wheels, many color-wheel interfaces include a curved control next to the circle. This control usually adjusts luminance for the specific range. Each wheel represents three important values: hue, saturation, and luminance. The disc handles hue and saturation, while the curved control adjusts luminance, providing more useful control than a simple color picker.

Color wheels are not the same as filters, as filters are predefined groups of adjustments that provide quick results but offer limited control. In contrast, color wheels provide detailed manual correction and grading capabilities. They can work together, with a user applying a filter as a starting point and then refining specific areas with the wheels.