LeaVerou/conic-gradient

Alpha (transparency) transitions are going wrong

Opened this issue · 0 comments

eonj commented

Pie chart

Above image is pie chart example with 'transparent' stop.

The shorthand 'transparent' is translated to rgba(0, 0, 0, 0) via getComputedStyle so the gradient comes from transparent-black to gold. This kind of problem is reported in early implementations of linear/radial gradient and fixed following the spec.

Almost right

Above image shows the almost-right answer. The gradient-right way to process transparency transition, using alpha-premultiplied space, is described in W3C TR css3-images and tech refs.