Skip to content

Main content

Design Token Alpha Overlap Opacity Term Tool

Source-over alpha of aligned layers, without color compositing or blend-mode behavior.

Loading tool…

Description

Multiply complementary transparencies for two or optionally three layers and return one minus that product as combinedAlpha.

Opacity controls how much a layer contributes to compositing; coverage describes how much area is marked. Overlapping transparent layers therefore require an overlap or compositing model rather than simply adding every percentage.

Multiply complementary transparencies for two or optionally three layers and return one minus that product as combinedAlpha.

When to use this tool

Use Design Token Alpha Overlap Opacity Term when you need a bounded opacity calculation or a coverage budget under a stated overlap model.

How to use the tool and how it works

  1. Enter firstAlpha, secondAlpha, thirdAlpha, includeThird. Use the units and conventions below.
  2. Run the tool. Correct any format, range, or cross-field input error before interpreting the output.
  3. Read combinedAlpha, residualTransparency. Use the output convention below.

Require firstAlpha, secondAlpha, and thirdAlpha in [0, 1]. Multiply complementary transparencies for two or optionally three layers and return one minus that product as combinedAlpha.1

Source-over opacity combines as one minus the product of the layer transparencies. Color channels and other blend modes require additional calculations.2

Input fieldMeaning and unitsAccepted input
firstAlphaFirst AlphaRequired. Finite number; minimum 0; maximum 1.
secondAlphaSecond AlphaRequired. Finite number; minimum 0; maximum 1.
thirdAlphaThird AlphaRequired. Finite number; minimum 0; maximum 1.
includeThirdInclude ThirdRequired. Boolean.
Output fieldInterpretationReturned shape
combinedAlphaCombined AlphaRequired. Finite number.
residualTransparencyResidual TransparencyRequired. Finite number.
json
{
  "input": {
    "firstAlpha": 0.5,
    "secondAlpha": 0.5,
    "thirdAlpha": 0.2,
    "includeThird": true
  },
  "output": {
    "combinedAlpha": 0.8,
    "residualTransparency": 0.2
  }
}

Limitations and assumptions

  • The third alpha is validated even when excluded; this computes only alpha under the stated layer model, without RGB color, blending modes, masks, spatial overlap, or color-space handling.
  • Inputs must satisfy both the field types and the cross-field conditions above. Invalid input causes an error; a successful false flag or documented placeholder is a different result.
  • Numeric calculations use binary floating point unless exact decimal-integer arithmetic is explicitly stated. No hidden measurement tolerance or decimal rounding is added; nonfinite or out-of-contract results are rejected. Numeric signed-zero results are exported as zero.

Alternative or Complementary methods

Render the actual layers for color and appearance checks. For area coverage, measure their geometric union and intersection when the supplied overlap model is insufficient.

References

  1. Calculation and input contract: graphic-design/design-token-alpha-overlap-opacity-term — tool.io

  2. Compositing and Blending Level 1: simple alpha compositing — W3C

Similar or alternative tools