コメント募集: HWB 関数

CSSワーキンググループは最近、Color Level 4仕様で様々なエキサイティングな作業を行っており、Sassチームはこれらの素晴らしい新機能をSassの色モデルに統合する方法について検討し始めています。Lab色空間のような複雑な機能については、最適な設計を決定するためにさらに時間が必要ですが、そのためといって新しい色の機能を追加できないわけではありません 。

本日、そのような機能の1つに関する提案を発表します。HWB色の組み込みSass関数です！この提案（SassコアチームメンバーであるMiriam Suzanneによって作成）が承認され、実装されると、HWB構文で色を記述し、今日の彩度と明度を調整するのと同じ方法で、白さと黒さを調整できるようになります 。

関数関数へのパーマリンク

この提案で追加される新しい改良された関数は次のとおりです 。

color.hwb()color.hwb()へのパーマリンク

color.hwb()関数は、色相、白さ、黒さを用いて色を定義します。既存のrgb()関数とhsl()関数と同様に、仕様で定義されているスペース区切り構文（hwb(270 20% 40%)）またはSass風のカンマ区切り構文（hwb(270, 20%, 40%)）のいずれかを使用できます。HWB色は他のすべてのSass色値と同じsRGB色空間を使用するため、このように作成された色は、すべての既存のSass色関数と完全に互換性があり、ブラウザの互換性を最大限に高めるためにRGB相当物として出力されます 。

rgb()関数とhsl()関数とは異なり、この提案ではこの関数をグローバルスコープに追加していません。これは、少なくとも1つのブラウザが実装するまで、Sassは新しいCSS構文のサポートを追加しないというポリシーがあるためです。仕様はブラウザによって確定されるまで変更される傾向があり、Sassがブラウザ自体とは異なるものをサポートすることになると、それは良くない 知らせです！

color.whiteness()とcolor.blackness()color.whiteness()とcolor.blackness()へのパーマリンク

これらの関数は、HSL色のcolor.saturation()関数とcolor.lightness()関数の動作と同様です。color.hwb()を使用して作成されていない色にも機能するため、これらの関数を使用して、任意の色がどの程度淡いか、暗いのかを確認できます 。

HWB色はHSL色と同じ「色相」の概念を持っているため、既存のcolor.hue()関数は既に完璧に機能します ！

color.scale()、color.adjust()、およびcolor.change()color.scale()、color.adjust()、およびcolor.change()へのパーマリンク

3つの色の変更関数はすべて、$whiteness引数と$blackness引数をサポートするようになりました。色（作成方法に関係なく）を20％白くしたい場合は、color.scale($color, $whiteness: 20%)に渡すだけで済みます ！

ご意見をお聞かせください！ご意見をお聞かせください！へのパーマリンク

この提案の詳細を知りたい場合は、GitHubで全文をお読みください。今後1ヶ月間、コメントと改訂を受け付けていますので、変更したい点があれば、issueを作成していただき、ご相談いただければ幸いです 。