狀態顏色權杖

已核准的元件別名 開始,然後在最終匯出步驟之前將它們對應到懸停、活動、停用、焦點或選定狀態權杖。

此頁面位於語意與元件命名之後,用於狀態別名交接,而不是第一次無障礙檢查或原始匯出。

其他語言 日本語 | English | 繁體中文 | 繁體中文(香港)

如何使用

  1. 在色票已經具有可信的語意與元件別名之後開始。
  2. 選擇與目標系統相符的預設,然後先查看懸停、活動、焦點、停用或選定的別名。
  3. 一旦狀態層對於設計系統文件或工程交接足夠清晰,就複製 CSS 變數或 JSON 區塊。

從元件別名移至狀態別名

此頁面填補了「元件權杖名稱看起來不錯」和「工程現在需要懸停、活動、焦點、停用或選定狀態名稱」之間的空白。

將元件別名對應到狀態別名。

淺色狀態別名
深色狀態別名
CSS 變數
JSON

如何在附近的頁面之間進行選擇

使用 無障礙色票 當角色色彩仍在調整時。使用 語意顏色權杖 當語意命名本身仍然是主要工作時。使用 元件顏色權杖 當按鈕、卡片、輸入、導航或徽章別名仍在命名時。在這些步驟之後,當剩下的問題是在匯出之前應如何命名懸停、活動、焦點、停用或選定狀態時,請使用此頁面。使用 顏色權杖預覽, 顏色權杖審核, 和 顏色權杖差異 當真正的問題仍然是簽核或比較而不是狀態命名。

常見問題解答

這個頁面會產生什麼?

它將已核准的元件別名對應到狀態級權杖,例如懸停、活動、停用、焦點或選擇,然後匯出 CSS 變數和 JSON。

我什麼時候應該使用它來代替元件顏色權杖?

當按鈕、卡片、輸入、導航或徽章別名仍然是主要工作時,請使用元件顏色權杖。之後,當團隊現在需要在這些元件別名之上建立狀態別名時,請使用此頁面。

我什麼時候應該使用它而不是顏色權杖匯出?

當角色層級權杖已足以交接時,請使用顏色權杖匯出工具。當最終匯出之前仍需要修復狀態別名時,請使用此頁面。

共用 URL 中儲存了什麼?

共用 URL 儲存基色、權杖前綴、無障礙目標、選定狀態預設以及是否包含深色別名。