Sass Color Functions
You are Here:
Sass Color Functions
The following are the list of inbuilt color functions available in Sass language.
| Functions | Explanation |
|---|---|
| adjust-color() | Increases or decreases one or more properties of a given color by fixed amounts. |
| adjust-hue() | Increases or decreases a given color's hue. |
| alpha() | Returns the alpha (opacity) channel of a given color as a number between 0 and 1. |
| blue() | Returns the blue channel of a given color as a number between 0 and 255. |
| change-color() | Sets one or more properties of a color to new values. |
| complement() | Returns the RGB complement of a given color. |
| darken() | Makes a given color daker. |
| desaturate() | Makes a given color less saturated. |
| grayscale() | Returns a gray color with the same lightness as a given color. |
| green() | Returns the green channel of a given color as a number between 0 and 255. |
| hsl() | Returns a color with the given hue, saturation, and lightness and the given alpha channel. |
| hue() | Returns the hue of a given color as a number between 0deg and 255deg. |
| ie-hex-str() | Returns an unquoted string that represents a given color in the #AARRGGBB format expected by Internet Explorer's -ms-filter property. |
| invert() | Returns the inverse or negative of a given color. |
| lighten() | Makes a given color lighter. |
| lightness() | Returns the HSL lightness of a given color as a number between 0% and 100%. |
| mix() | Returns a number that’s a mixture of a given color1 and color2. |
| opacify() | Makes a given color more opaque. |
| red() | Returns the red channel of a given color as a number between 0 and 255. |
| rgb() | Returns a color with the given red, green, blue, and alpha channels. |
| saturate() | Makes a given color more saturated. |
| saturation() | Returns the HSL saturation of a given color as a number between 0% and 100%. |
| scale-color() | Fluidly scales one or more properties of a given color. |
| transparentize() | Makes a given color more transparent. |
Reminder
Hi Developers, we almost covered 99.1% of Sass Tutorials with examples for quick and easy learning.
We are working to cover every Single Concept in Sass.
Please do google search for:
Join Our Channel
Join our telegram channel to get an instant update on depreciation and new features on HTML, CSS, JavaScript, jQuery, Node.js, PHP and Python.
This channel is primarily useful for Full Stack Web Developer.
