Quieter

/impeccable quieter

适用场景

• 強烈的想法存在，但頁面太大聲了。
• 你需要克制而不變得平淡。
• 目前的調性壓過了閱讀或任務流程。

何時使用

/impeccable quieter 是 /impeccable bolder 的對應。當介面在視覺上具有攻擊性、過度刺激，或試圖以最大音量同時做太多事情時使用。深色上的霓虹、到處都是漸層文字、6 種重點色、所有東西都有動畫、20px 陰影。當設計需要呼吸空間而你想要在不失去觀點的情況下獲得精煉時使用 quieter。

在 /impeccable bolder 有點過頭時也很有用。

運作方式

技能透過四個軸線的減法來運作：

1. 色彩：去飽和、在 OKLCH 中降低色度、將重點色拉回到單一主要色加上柔和輔助色。不超過兩種有意圖的色彩。
2. 對比：柔化極端的暗和亮，將範圍拉近。背景從純白和純黑移動到紙張和墨色。
3. 裝飾：移除沒有在發揮作用的陰影、放下不承載結構的邊框、退役為了活力而非層次存在的漸層。
4. 動態和效果：放慢動畫、移除所有自動播放的東西、放下視差和模糊，除非它們服務於可讀性。

技能保留設計的意圖。如果原版有觀點，更安靜的版本有相同的觀點但更有信心。是精煉，不是中和。

試試看

/impeccable quieter the pricing page

典型變更：

• 價格上的漸層文字移除，替換為一級更重的純墨色
• 三種重點色減少為一種（洋紅），另外兩種變為中性變體
• 卡片陰影從 0 20px 40px rgba(0,0,0,0.2) 減少為 0 1px 0 var(--color-mist)（一條髮絲線）
• 背景從深色漸層切換為頂部帶微妙奶油渲染的紙張
• Hero 動畫從 1.2s easeOut 搭配 3 個交錯元素改為單一 260ms 淡入

注意事項

• 過度使用。 Quieter 能剝奪個性，如果你在已經克制的東西上執行它。在設計太大聲時使用，不是在設計正確地堅定時使用。
• 混淆 quieter 與 distill。 Quieter 降低強度。Distill 移除元素。它們是不同的操作。
• 因為 critique 說「太忙」而執行。 忙通常意味著東西太多，不是太大聲。先試試 /impeccable distill。

相关命令

• Bolder
• Distill
• Polish