Appendix D
Blend and Filter Types ![this is a feature of OmniGraffle Pro](/doc-assets/omnigraffle-ios-v3.0.0.0/en/art/og3ios_badge_pro.png)
If you have OmniGraffle Pro, tapping Show Fill Options at the bottom of the Fill inspector reveals Blend Types and Filter Types that you can apply to a shape.
Blends and Filters rely on a base shape or image object in the background (either on the same or a different layer), with the Blend or Filter applied to an object in the foreground.
![two images stacked on top of each other; the image in the background does not have a filter applied, while the image on top is a shape with a filter applied](/doc-assets/omnigraffle-ios-v3.0.0.0/en/art/og3ios_hero_blendsfilters.png)
You can combine a blend and filter on the same object, or you can place them on different objects and rearrange them in the object stack to create different visual effects.
To create the Sample Images shown in the Blend Type and Filter Type tables, an image is used in the background, with a shape layered on top that contains the Blend or Filter type. The Blend Types, in particular, work by evaluating the colors of both the background and foreground objects and then blending those colors for the composition.
You may need to try different color fills for the object that contains the Blend Type—or even multiple objects with Blend fills—to get the desired effect.
Blend Type ![this is a feature of OmniGraffle Pro](/doc-assets/omnigraffle-ios-v3.0.0.0/en/art/og3ios_badge_pro.png)
Apply a blend type to the selected object. Blends have a visual effect on objects or layers underneath.
Blend Type | Description | Sample Image |
---|---|---|
Normal | The selected object has no blend applied. | ![]() |
Multiply | Multiplies the color inputs of the background and foreground objects, resulting in a darker value. | ![]() |
Screen | Multiplies the inverse color values of the background and foreground objects, resulting in a lighter shade. | ![]() |
Overlay | Multiplies or screens the colors, preserving the highlights and shadows of the background object. | ![]() |
Darken | The color values of the background and foreground objects are compared, resulting in the darker of the two color values being used. | ![]() |
Lighten | The color values of the background and foreground objects are compared, resulting in the lighter of the two color values being used. | ![]() |
Dodge | Brightens the background object, ignoring black color values of the foreground object; the resulting image looks somewhat washed, depending on the input color values. | ![]() |
Burn | Darkens the background object based on the color values of the foreground object, ignoring any white color values of the blend. | ![]() |
Soft Light | Darkens or lightens the colors, based in the color values of the background object. | ![]() |
Hard Light | Multiplies or screens colors, depending on the color values of the background object. | ![]() |
Difference | Compares and subtracts the darker color values of the background and foreground objects. If the foreground object is is white, the background object is inverted; there is no change if the foreground object is black. | ![]() |
Exclusion | Similar to Difference, but produces a lower contrast. | ![]() |
Hue | Uses the saturation and luminance values of the background object, and blends those with the hue value of the foreground object. | ![]() |
Saturation | Uses the hue and luminance values of the background object, and blends those with the saturation value of the foreground object. | ![]() |
Color | Uses the luminance value of the background object, and blends that with the hue and saturation values of the foreground object. | ![]() |
Luminosity | Uses the hue and saturation values of the background object, and blends those with the luminance of the foreground object. | ![]() |
XOR | XOR is primarily used in image processing—not composition—by comparing pixels to the background object with those of the foreground object with the XOR blend applied. If the pixels are the same, the XOR object’s fill is changed to black; otherwise, it gains a white fill. | |
Plus Darker | Similar to Burn; darkens the background object while increasing the contrast. | ![]() |
Plus Lighter | Similar to Dodge; brightens the background object while increasing contrast. | ![]() |
Filter Type ![this is a feature of OmniGraffle Pro](/doc-assets/omnigraffle-ios-v3.0.0.0/en/art/og3ios_badge_pro.png)
Apply a filter type to the selected object. Use the Opacity slider in either the HSB, RGB, or Gray color panel to change the Filter shape’s opacity to zero (0) to see the effect of the filter.
Filter Type | Description | Sample Image |
---|---|---|
None | No filter is applied to the background object. | ![]() |
Blur | Applies a fuzzy blur to the background object; tap ![]() ![]() |
![]() |
Pixelate | Pixelates the background object; tap ![]() ![]() |
![]() |
Magnify | Magnifies the background object; tap ![]() ![]() |
![]() |