SassColor

Sass 的 顏色型別。

無論最初使用什麼表示形式來建立此顏色，其所有通道都可訪問。

層次結構

建構函式

constructor

訪問器

alpha asList blackness blue channels channelsOrNull green hasBrackets hue isLegacy isTruthy lightness realNull red saturation separator space whiteness

方法

assertBoolean assertCalculation assertColor assertFunction assertMap assertMixin assertNumber assertString change channel equals get hashCode interpolate isChannelMissing isChannelPowerless isInGamut sassIndexToListIndex toGamut toSpace tryMap

建構函式

建構函式

  • 建立一個 RGB 顏色。

    如果 space 缺失，則**僅**應使用 undefined 來指示未傳遞 alpha。如果改為使用 null，則將其視為 缺失的元件。有關詳細資訊，請參閱 重大更改。

    如果定義了 space 併為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha?: null | number;
          blue: null | number;
          green: null | number;
          red: null | number;
          space?: "rgb";
      }
      • 可選 alpha?: null | number
      • blue: null | number
      • green: null | number
      • red: null | number
      • 可選 space?: "rgb"

    返回 SassColor

建構函式

  • 建立一個 HSL 顏色。

    如果 space 缺失，則**僅**應使用 undefined 來指示未傳遞 alpha。如果改為使用 null，則將其視為 缺失的元件。有關詳細資訊，請參閱 重大更改。

    如果定義了 space 併為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha?: null | number;
          hue: null | number;
          lightness: null | number;
          saturation: null | number;
          space?: "hsl";
      }
      • 可選 alpha?: null | number
      • hue: null | number
      • lightness: null | number
      • saturation: null | number
      • 可選 space?: "hsl"

    返回 SassColor

建構函式

  • 建立一個 HWB 顏色。

    如果 space 缺失，則**僅**應使用 undefined 來指示未傳遞 alpha。如果改為使用 null，則將其視為 缺失的元件。有關詳細資訊，請參閱 重大更改。

    如果定義了 space 併為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha?: null | number;
          blackness: null | number;
          hue: null | number;
          space?: "hwb";
          whiteness: null | number;
      }
      • 可選 alpha?: null | number
      • blackness: null | number
      • hue: null | number
      • 可選 space?: "hwb"
      • whiteness: null | number

    返回 SassColor

建構函式

  • 建立一個 Lab 或 Oklab 顏色。

    如果為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          a: null | number;
          alpha?: null | number;
          b: null | number;
          lightness: null | number;
          space: ColorSpaceLab;
      }
      • a: null | number
      • 可選 alpha?: null | number
      • b: null | number
      • lightness: null | number
      • space: ColorSpaceLab

    返回 SassColor

建構函式

  • 建立一個 LCH 或 Oklch 顏色。

    如果為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha?: null | number;
          chroma: null | number;
          hue: null | number;
          lightness: null | number;
          space: ColorSpaceLch;
      }
      • 可選 alpha?: null | number
      • chroma: null | number
      • hue: null | number
      • lightness: null | number
      • space: ColorSpaceLch

    返回 SassColor

建構函式

  • 在預定義的 RGB 顏色空間中建立一個顏色。

    如果為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha?: null | number;
          blue: null | number;
          green: null | number;
          red: null | number;
          space: "display-p3" | "srgb" | "rec2020" | "a98-rgb" | "prophoto-rgb" | "srgb-linear";
      }
      • 可選 alpha?: null | number
      • blue: null | number
      • green: null | number
      • red: null | number
      • space: "display-p3" | "srgb" | "rec2020" | "a98-rgb" | "prophoto-rgb" | "srgb-linear"

    返回 SassColor

建構函式

  • 在預定義的XYZ 色彩空間中建立顏色。

    如果為任何元件傳遞了 null，則將其視為 缺失的元件。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha?: null | number;
          space: ColorSpaceXyz;
          x: null | number;
          y: null | number;
          z: null | number;
      }
      • 可選 alpha?: null | number
      • space: ColorSpaceXyz
      • x: null | number
      • y: null | number
      • z: null | number

    返回 SassColor

訪問器

alpha

asList

blackness

blue

channels

channelsOrNull

green

hasBrackets

  • get hasBrackets(): boolean

  • 此值作為列表是否帶括號。

    所有 SassScript 值都可以用作列表。對映計為成對的列表，所有其他值計為單值列表。

    返回 boolean

hue

isLegacy

  • get isLegacy(): boolean

  • 一個布林值，指示此顏色是否處於舊版色彩空間（rgb、hsl 或 hwb）。

    返回 boolean

isTruthy

  • get isTruthy(): boolean

  • 該值在 @if 語句和其他上下文中是否計為 true。

    返回 boolean

lightness

realNull

red

saturation

separator

space

whiteness

方法

assertBoolean

assertCalculation

assertColor

assertFunction

assertMap

assertMixin

assertNumber

assertString

change

  • 返回一個新的顏色，它是更改此顏色的一個或多個HSL 通道的結果。

    丟擲

    如果 space 缺失且此顏色不在傳統顏色空間（rgb、hsl 或 hwb）中，則會引發 Error。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha: undefined | null | number;
          hue: undefined | null | number;
          lightness: undefined | null | number;
          saturation: undefined | null | number;
      } & {
          space?: "hsl";
      }

    返回 SassColor

change

  • 返回一個新的顏色，它是更改此顏色的一個或多個HWB 通道的結果。

    丟擲

    如果 space 缺失且此顏色不在傳統顏色空間（rgb、hsl 或 hwb）中，則會引發 Error。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha: undefined | null | number;
          blackness: undefined | null | number;
          hue: undefined | null | number;
          whiteness: undefined | null | number;
      } & {
          space?: "hwb";
      }

    返回 SassColor

change

  • 返回一個新的顏色，它是更改此顏色的一個或多個 Lab 通道的結果。

    丟擲

    如果 space 缺失且此顏色不在 Lab 或 Oklab 顏色 空間中，則會引發 Error。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          a: undefined | null | number;
          alpha: undefined | null | number;
          b: undefined | null | number;
          lightness: undefined | null | number;
      } & {
          space?: ColorSpaceLab;
      }

    返回 SassColor

change

  • 返回一個新的顏色，它是更改此顏色的一個或多個LCH 通道的結果。

    丟擲

    如果 space 缺失且此顏色不在LCH或 Oklch 顏色 空間中，則會引發 Error。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha: undefined | null | number;
          chroma: undefined | null | number;
          hue: undefined | null | number;
          lightness: undefined | null | number;
      } & {
          space?: ColorSpaceLch;
      }

    返回 SassColor

change

  • 返回一個新的顏色，它是更改此顏色的一個或多個RGB 通道的結果。

    丟擲

    如果 space 缺失且此顏色不在傳統顏色空間（rgb、hsl 或 hwb）中，則會引發 Error。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha: undefined | null | number;
          blue: undefined | null | number;
          green: undefined | null | number;
          red: undefined | null | number;
      } & {
          space?: ColorSpaceRgb;
      }

    返回 SassColor

change

  • 返回一個新的顏色，它是更改此顏色的一個或多個XYZ 通道的結果。

    丟擲

    如果 space 缺失且此顏色不在XYZ顏色 空間中，則會引發 Error。

    丟擲

    如果設定了 alpha 且它不是 null 或 0 到 1 之間的一個數字，則丟擲 Error。

    引數

    • options: {
          alpha: undefined | null | number;
          x: undefined | null | number;
          y: undefined | null | number;
          z: undefined | null | number;
      } & {
          space?: ColorSpaceXyz;
      }

    返回 SassColor

通道

通道

  • 將此顏色轉換為指定的 space 後，返回此顏色的單個指定 channel 的值，其中缺少的通道轉換為 0。

    丟擲

    如果 channel 不是 alpha 或 space 中的通道，則會引發 Error。

    引數

    • channel: ChannelNameHsl
    • options: {
          space: "hsl";
      }
      • space: "hsl"

    返回 number

通道

通道

通道

通道

通道

equals

get

  • 返回此值作為列表中索引 index 處的值，如果 index 對此列表無效，則返回 undefined。

    所有 SassScript 值都可以用作列表。對映計為成對的列表，所有其他值計為單值列表。

    這是 this.asList.get(index) 的簡寫，儘管在某些情況下它可能更有效。

    ⚠️ 注意！

    此方法使用與 immutable 包相同的索引約定：與 Sass 不同，第一個元素的索引為 0，但與 Sass 類似，負數從列表的末尾開始索引。

    引數

    • index: number

    返回 undefined | Value

hashCode

interpolate

  • 根據 CSS 顏色 4 顏色插值過程中的 method，返回此顏色與 color2 之間的部分顏色。

    如果 method 缺失並且此顏色位於矩形顏色空間（Lab、Oklab、RGB 和 XYZ 空間）中，則 method 預設為此顏色的顏色空間。否則，method 預設為包含此顏色的顏色空間和字串“shorter”的空間分隔列表。

    weight 是一個介於 0 和 1 之間的數字，表示結果顏色中應該包含多少此顏色。如果省略，則預設為 0.5。

    引數

    返回 SassColor

isChannelMissing

isChannelPowerless

  • 返回一個布林值，指示給定的channel在此顏色中是否無效。這是一種為各個顏色空間定義的特殊狀態，它表示通道的值不會影響顏色的顯示方式。

    引數

    返回 boolean

isChannelPowerless

isChannelPowerless

isChannelPowerless

isChannelPowerless

isChannelPowerless

isChannelPowerless

isInGamut

  • 返回一個布林值，指示此顏色是否在色域內（與其一個或多個通道超出範圍相反），用於指定的space，或者如果未指定space則為其當前顏色空間。

    引數

    返回 boolean

sassIndexToListIndex

  • 將sassIndex轉換為由asList返回的列表中的JavaScript樣式索引。

    Sass索引基於1，而JavaScript索引基於0。Sass索引也可能是負數，以便從列表的末尾進行索引。

    丟擲

    錯誤如果sassIndex不是數字，如果該數字不是整數，或者如果該整數不是asList的有效索引。

    引數

    • sassIndex: Value

      作為列表的Sass樣式索引。

    • 可選 name: string

      如果sassIndex來自引數，則其來自的函式引數名稱（不帶$），用於錯誤報告。

    返回 number

toGamut

toSpace

tryMap