Im Folgenden werden Funktionen der Komponenten erklärt, die die SCSS Bibliothek erweitern:
Mathematische Funktionen¶ ↑
max¶ ↑
max(a, b):Number
Vergleicht a und b; gibt den höheren Wert zurück
min¶ ↑
min(a, b):Number
Vergleicht a und b; gibt den kleineren Wert zurück
Layout¶ ↑
building units¶ ↑
building-unit-box-padding¶ ↑
building-unit-box-padding($line-height, $height, $padding-horizontal)
Erstellt Padding-Werte pasierend auf den Building-Units.
fallback-rgba¶ ↑
fallback-rgba($color, $alpha, $background-color: #fff):color
Gibt eine transparente Farbe als Farbe ohne Transparenz zur Grundfarbe Weiß zurück. Die Farbe gegen die gerechnet wird, kann optional übergeben werden.
capline-pixels¶ ↑
capline-pixels($font-size):Number
Ermittelt die Anzahl der Pixel zwischen Versalhöhe und border einer Schrift bei gegebener Größe und der standardmäßigen Zeilenhöhe.
baseline-pixels¶ ↑
baseline-pixels($font-size):Number
Ermittelt die Anzahl der Pixel zwischen Grundline und border einer Schrift bei gegebener Größe und der standardmäßigen Zeilenhöhe.
Farbfunktionen¶ ↑
HSV-Farbraum¶ ↑
Funktionen für Farben im HSV-Farbraum, wie bspw. in Adobes Photoshop. Farben werden dort mittels Farbton (hue), saturation (Sättigung), Hellwert (value) definiert.
hsv¶ ↑
hsv(hue: 0, saturation: 100%, value: 100%):(hue, saturation, value, 1)
Ein HSV-Farbraum Farb-Objekt (Alpha=1)
hsva¶ ↑
hsva(hue: 0, saturation: 100%, value: 100%, alpha: 1):(hue, saturation, value, alpha);
Ein HSV-Farbraum Farb-Objekt mit Alphawert
color-to-hsv¶ ↑
color-to-hsv(color/red, green: 0, b: 0, a: 1):hsva
Erwartet eine RGB(A)-Farbe (color) oder vier Farbkomponenten (Rot, Grün, Blau, Alpha) und gibt die Farbe im HSV-Farbraum (hsv) zurück.
hsv-to-color¶ ↑
hsv-to-color(hsv(a)/hue, saturation: 100%, value: 100%, alpha: 1):color
Erwartet eine HSV(A)-Farbe (hsv(a)) oder vier Farbkomponenten (hue, saturation, value, alpha) und gibt die Farbe im RGB-Farbraum (rgb(a)) zurück.
hsv-hue¶ ↑
hsv-hue(hsv/color):Number
Gibt den Farbton (hue) einer Farbe (hsv/color) zurück.
hsv-set-hue¶ ↑
hsv-set-hue(color/hsv, hue, return-rgb-color: false):hsv/color
Setzt den Farbton einer Farbe im HSV-Farbraum und gibt sie zurück.
Erwartet eine Farbe (color/hsv) und den zu setzenden Wert. Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
hsv-saturation¶ ↑
hsv-saturation(color/hsv):Number
Gibt den Sättigungswert einer Farbe im HSV-Farbraum zurück. Erwartet eine Farbe im rgb oder hsv Farbraum (color/hsv)
hsv-set-saturation¶ ↑
hsv-set-saturation(hsv, saturation, return-rgb-color: false):hsv/color
Setzt den Sättigungswert einer Farbe im HSV-Farbraum und gibt sie zurück.
Erwartet eine Farbe (color/hsv) und den zu setzenden Wert. Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
hsv-value¶ ↑
hsv-value(color/hsv):Number
Gibt den Helligkeitswert einer Farbe im HSV-Farbraum zurück. Erwartet eine Farbe im rgb oder hsv Farbraum (color/hsv)
hsv-set-value¶ ↑
hsv-set-value(hsv, value, return-rgb-color: false):hsv/color
Setzt den Helligkeitswert einer Farbe im HSV-Farbraum und gibt sie zurück.
Erwartet eine Farbe (color/hsv) und den zu setzenden Wert. Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
hsv-alpha¶ ↑
hsv-alpha(color/hsv):Number
Gibt den Opazitätswert einer Farbe im HSV-Farbraum zurück. Erwartet eine Farbe im rgb oder hsv Farbraum (color/hsv)
hsv-set-alpha¶ ↑
hsv-set-alpha(hsv, alpha, return-rgb-color: false):hsv/color
Setzt den Opazitätswert einer Farbe im HSV-Farbraum und gibt sie zurück.
Erwartet eine Farbe (color/hsv) und den zu setzenden Wert. Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
HSV modifikations Funktionen¶ ↑
hsv-invert¶ ↑
hsv-invert($hsv-color, $return-rgb-color: false):hsv/color
Invertiert alle Werte einer Farbe im HSV-Farbraum mit Ausnahme des Alphawertes.
Der zweite Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
hsv-adjust-brightness¶ ↑
hsv-adjust-brightness(hsv, brightness-shift, return-rgb-color: false):hsv/color
Ändert den Helligkeitswert einer Farbe im HSV-Farbraum, ausgehend vom ursprünglichen Wert Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
hsv-adjust-hue¶ ↑
hsv-adjust-hue(hsv, hue-shift, return-rgb-color: false):hsv/color
Ändert den Farbton einer Farbe im HSV-Farbraum, ausgehend vom ursprünglichen Wert um die angegebenen Grad°. Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
hsv-adjust-saturation¶ ↑
hsv-adjust-saturation(hsv, saturation-shift, return-rgb-color: false):hsv/color
Ändert den Farbton einer Farbe im HSV-Farbraum, ausgehend vom ursprünglichen Wert um die angegebenen Grad°. Der dritte Parameter bestimmt ob die zurückgegebene Farbe im RGB oder HSV Farbraum definiert sein soll @default: hsv
Weitere Funktionen¶ ↑
hsv-lighten¶ ↑
hsv-lighten($hsv-color, $value, $return-rgb-color: false):hsv/color
Erhöht die Helligkeit der Farbe.
hsv-darken¶ ↑
hsv-darken($hsv-color, $value, $return-rgb-color: false):hsv/color
Verringert die Helligkeit der Farbe.
hsv-saturate¶ ↑
hsv-saturate($hsv-color, $value, $return-rgb-color: false):hsv/color
hsv-adjust-desaturate¶ ↑
hsv-desaturate(hsv-color, value, return-rgb-color: false):hsv/color
Verringert die Sättigung der Farbe um den angegebenen Wert.
hsv-adjust-grayscale¶ ↑
hsv-grayscale($hsv-color, $return-rgb-color: false):hsv/color
Gibt die als reinen Grauwert zurück.
hsv-adjust-complement¶ ↑
hsv-complement($hsv-color, $return-rgb-color: false):hsv/color
Gibt die Komplementärfarbe zurück.