This is hard to explain but I am going to try, then I will explain it as pure mathematics.

Look at this image. enter image description here So basically this is a moving line, each frame a new segment is added and the previous frame is faded by an amount decided by fps. (There are dots to make things neat but I'm not showing them for simplicity).

So based on the FPS a number is calculated (0.05 if perfect FPS ) and as a result the previous frame gets a black plane drawn over it with an opacity of 0.05.

As you can see this causes an issue because of the segments. My solution is to give each vertex a color, however I don't know how to calculate that color. The line color is defined by HSV, and the fading is decided by RGB. Furthermore I am pretty sure fading with the transparent plane creates an exponential effect, however HSV.V works linearly.

My question is if I know on a given frame that the fading plane will have an opacity of 0.05 how can I calculate an equivalent HSV color to what the previous frame will be after fading? That way the bottom two vertices can be a darker color and interpolation can fix it.

The formula that decides the opacity of the black is as follows.

(dt / (1 / 60)) * 0.5
  • $\begingroup$ "As you can see this causes an issue because of the segments.". Could you describe what problem you are seeing? What about the picture should be different? $\endgroup$ Commented May 25, 2016 at 21:28
  • $\begingroup$ @Trichoplax the line has clear segments inside of it. The line should be smooth. $\endgroup$
    – J.Doe
    Commented May 25, 2016 at 21:30
  • $\begingroup$ Do you mean that there should be no visible colour difference between the segments? $\endgroup$ Commented May 25, 2016 at 21:50
  • $\begingroup$ @trichoplax I just want the color to be smooth. I want the new segment to math nicely with the previous faded one. Just so that everything looks continuous in both shape and color. $\endgroup$
    – J.Doe
    Commented May 25, 2016 at 22:22

2 Answers 2


The opacity acts linearly through the colors, i.e. it affects R G B similarily, so it should affects the value V the same way. You just want to have an intensity factor decay as $0.95^n$.

  • $\begingroup$ What does n mean? Why 0.95? $\endgroup$
    – J.Doe
    Commented May 25, 2016 at 21:31
  • $\begingroup$ opacity 0.05 means transparency 0.95, i.e. the intensity scaling. n is the number of passes (i.e. number of times you apply a 0.05 opacity). $\endgroup$ Commented May 26, 2016 at 15:52

First off you want the start of each line to have the color of an already faded line, ie rgb_color*0.95. You already figured out how to do this so I stop there.

For the HSV you are interested in the Value component only when fading towards black. Basically you should do hsv_color.value*0.95.

I typed this on phone. Please edit if you get it and may explain better.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.