The radial-gradient() function is an inbuilt function in CSS which is used to set a radial gradient as the background image. It starts at a single point and emanates outward. By default, the first color starts at the center position of the element and then fade to the end color towards the edge of the element. Fade happens at an equal rate until specified.
background-image: radial-gradient( shape size at position, start-color, ..., last-color );
Parameters: This function accepts many parameters which are listed below:
- shape: This parameter is used to define the shape of gradient. It has two possible value circle or ellipse. The default shape value is ellipse.
- size: This parameter is used to define the size of gradient. The possible value are: farthest-corner (default), closest-side, closest-corner, farthest-side.
- position: This parameter is used to define the position of gradient. The default value is center.
- start-color, …, last-color: This parameter is used to hold the color value followed by its optional stop position.
Below example illustrates the radial-gradient() function in CSS:
- How to get the function name inside a function in PHP ?
- PHP | sin( ) Function
- PHP | cos( ) Function
- p5.js | sin() function
- p5.js | cos() function
- p5.js | pan() Function
- p5.js | arc() Function
- CSS | url() Function
- D3.js | d3.set.add() Function
- p5.js | log() function
- D3.js | d3.lab() Function
- p5.js | str() function
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.