|
| 1 | +<a href='https://www.powershellgallery.com/packages/gradient/'> |
| 2 | +<img src='https://img.shields.io/powershellgallery/dt/gradient' /> |
| 3 | +</a> |
| 4 | + |
1 | 5 | # Gradient |
2 | | -CSS and SVG Gradient Generator |
| 6 | + |
| 7 | +## CSS Gradient Generator |
| 8 | + |
| 9 | +CSS Gradients are pretty great. |
| 10 | + |
| 11 | +Their syntax is pretty flexible, but can require a commanding knowledge of CSS and comma placement. |
| 12 | + |
| 13 | +This PowerShell module tries to simplify things a bit. |
| 14 | + |
| 15 | +## Installing and Importing |
| 16 | + |
| 17 | +You can install Gradient from the PowerShell Gallery |
| 18 | + |
| 19 | +~~~PowerShell |
| 20 | +Install-Module Gradient |
| 21 | +~~~ |
| 22 | + |
| 23 | +Once installed, you can import Gradient with Import-Module |
| 24 | + |
| 25 | +~~~PowerShell |
| 26 | +Import-Module Gradient -PassThru |
| 27 | +~~~ |
| 28 | + |
| 29 | +### Cloning and Importing |
| 30 | + |
| 31 | +You can also install this module by cloning the repository and importing it |
| 32 | + |
| 33 | +~~~PowerShell |
| 34 | +git clone https://github.com/PowerShellWeb/Gradient |
| 35 | +Import-Module ./Gradient -PassThru |
| 36 | +~~~ |
| 37 | + |
| 38 | +## Generating gradients |
| 39 | + |
| 40 | +Gradients are really easy to generate: |
| 41 | + |
| 42 | +Let's make a red green blue radial gradient |
| 43 | + |
| 44 | +~~~PowerShell |
| 45 | +gradient red green blue |
| 46 | +~~~ |
| 47 | + |
| 48 | +This will give us back a Gradient object. |
| 49 | + |
| 50 | +It has our .input and also has a .css property that contains the gradient as CSS |
| 51 | + |
| 52 | +~~~PowerShell |
| 53 | +(gradient red green blue).CSS |
| 54 | +~~~ |
| 55 | + |
| 56 | +Gradients can get pretty cool. |
| 57 | +For some inspiration, check out the MDN topic on [using gradients](https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Images/Using_gradients) |
| 58 | + |
| 59 | +To get a full sense of what we can do with Gradient, |
| 60 | +feel free to check out [my page of gradient experiments](https://MrPowerShell.com/CSS/Gradients). |
| 61 | + |
| 62 | + |
0 commit comments