WENIGER - Farbkanalfunktionen

In diesem Kapitel werden wir die Bedeutung von Farbkanalfunktionen in WENIGER verstehen. WENIGER unterstützt nur wenige integrierte Funktionen, die den Wert eines Kanals festlegen. Der Kanal stellt den Wert abhängig von der Farbdefinition ein. Die HSL-Farben haben einen Farbton-, Sättigungs- und Helligkeitskanal und die RGB-Farbe einen Rot-, Grün- und Blaukanal. In der folgenden Tabelle sind alle Farbkanalfunktionen aufgeführt -


background: hue(hsl(75, 90%, 30%));
background: saturation(hsl(75, 90%, 30%));
background: lightness(hsl(75, 90%, 30%));
background: hsvhue(hsv(75, 90%, 30%));
background: hsvsaturation(hsv(75, 90%, 30%));
background: hsvvalue(hsv(75, 90%, 30%));
background: red(rgb(5, 15, 25));
background: green(rgb(5, 15, 25));
background: blue(rgb(5, 15, 25));
background: alpha(rgba(5, 15, 25, 1.5));
background: luma(rgb(50, 250, 150));
background: luminance(rgb(50, 250, 150));

Sr.Nr.	Bedienungsanleitung	Beispiel
1	hue Im HSL-Farbraum wird der Farbtonkanal aus dem Farbobjekt extrahiert.	`background: hue(hsl(75, 90%, 30%));` Es wird im CSS wie unten gezeigt kompiliert - `background: 75;`
2	saturation Im HSL-Farbraum wird der Sättigungskanal aus dem Farbobjekt extrahiert.	`background: saturation(hsl(75, 90%, 30%));` Es wird im CSS wie unten gezeigt kompiliert - `background: 90%;`
3	lightness Im HSL-Farbraum wird der Helligkeitskanal aus dem Farbobjekt extrahiert.	`background: lightness(hsl(75, 90%, 30%));` Es wird im CSS wie unten gezeigt kompiliert - `background: 30%;`
4	hsvhue Im HSV-Farbraum wird der Farbtonkanal aus dem Farbobjekt extrahiert.	`background: hsvhue(hsv(75, 90%, 30%));` Es wird im CSS wie unten gezeigt kompiliert - `background: 75;`
5	hsvsaturation Im HSL-Farbraum wird der Sättigungskanal aus dem Farbobjekt extrahiert.	`background: hsvsaturation(hsv(75, 90%, 30%));` Es wird im CSS wie unten gezeigt kompiliert - `background: 90%;`
6	hsvvalue Im HSL-Farbraum wird der Wertekanal aus dem Farbobjekt extrahiert.	`background: hsvvalue(hsv(75, 90%, 30%));` Es wird im CSS wie unten gezeigt kompiliert - `background: 30%;`
7	red Der rote Kanal wird aus dem Farbobjekt extrahiert.	`background: red(rgb(5, 15, 25));` Es wird im CSS wie unten gezeigt kompiliert - `background: 5;`
8	green Der grüne Kanal wird aus dem Farbobjekt extrahiert.	`background: green(rgb(5, 15, 25));` Es wird im CSS wie unten gezeigt kompiliert - `background: 15;`
9	blue Der blaue Kanal wird aus dem Farbobjekt extrahiert.	`background: blue(rgb(5, 15, 25));` Es wird im CSS wie unten gezeigt kompiliert - `background: 25;`
10	alpha Der Alphakanal wird aus dem Farbobjekt extrahiert.	`background: alpha(rgba(5, 15, 25, 1.5));` Es wird im CSS wie unten gezeigt kompiliert - `background: 2;`
11	luma Der Luma-Wert wird aus einem Farbobjekt berechnet.	`background: luma(rgb(50, 250, 150));` Es wird im CSS wie unten gezeigt kompiliert - `background: 71.2513323%;`
12	luminance Der Luma-Wert wird ohne Gammakorrektur berechnet.	`background: luminance(rgb(50, 250, 150));` Es wird im CSS wie unten gezeigt kompiliert - `background: 78.53333333%;`

ja/tutorial