Search code examples
csslinear-gradients

What does the percentage represent in linear-gradient : CSS?

What is the meaning of the 0% and 100% in the following CSS code ?

background : linear-gradient (to left , rgba (7,27,82,1) 0% , rgba (0,128,128,1) 100%);

Solution

  • If you specify the location as a percentage, 0% represents the starting point, while 100% represents the ending point; however, you can use values outside that range if necessary to get the effect you want. If you leave a location unspecified, the position of that particular color stop will be automatically calculated for you, with the first color stop being at 0% and the last color stop being at 100%, and any other color stops being half way between their adjacent color stops.

    source : https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients