Download - How to use online css gradient generator
Transcript
![Page 1: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/1.jpg)
Online CSS Gradient Generator
(guide how to use gradient generator tool)
![Page 2: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/2.jpg)
What is Gradient ?
• Gradient is a combination of colors.
( Red + Yellow )
![Page 3: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/3.jpg)
It also can be a combination of more then two colors..
Red + Yellow + Blue
![Page 4: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/4.jpg)
and each color of gradient is define by stopper
Color Stopper
![Page 5: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/5.jpg)
Location of the color stopper specify gradient pattern
![Page 6: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/6.jpg)
but What is Transparent Gradient ?
![Page 7: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/7.jpg)
Transparent is a alpha property of color stopper
It show visibility of color
![Page 8: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/8.jpg)
and transparency of gradient is define by alpha stopper
Alpha Stopper
![Page 9: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/9.jpg)
Combine Alpha Stopper + Color Stopper
![Page 10: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/10.jpg)
now Final Gradient contain 4 stoppers
![Page 11: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/11.jpg)
Gradient Orientation
• Linear Orientation• Radial Orientation
![Page 12: How to use online css gradient generator](https://reader035.vdocuments.net/reader035/viewer/2022062308/558e1b6a1a28abb85b8b4616/html5/thumbnails/12.jpg)
Linear Orientation• Linear Orientation - Linear gradient can be
possible in 360 degree direction