Sass 明清色(tint)、暗清色(shade)を表現する

以前のブログはこちら

広告

こんにちは。ましじめの田村です。

私が執筆した著書、『現場のプロから学ぶ CSSコーディングバイブル』は、Web制作の現場で役立つテクニックやノウハウをまとめています。
興味を持っていただけた方は、ぜひご覧ください。
https://amzn.to/3A8kNHC

このリンクは Amazon のアフィリエイトプログラムを通じて設定されています。

こんにちは。ましじめの田村です。

sassで 明清色と暗清色を作る機会がありました。
Compassで言うところのtint()shade()関数と同様の物になります。

compass:tint
compass:shade

明清色と暗清色というのは純色に「白」または「黒」のみを混ぜた色のことのようです。
現在ですとこの場合はmix関数を使うと実現出来そうです。 sass:color

//明清色 tint
mix(#fff, red, 40%); 

//暗清色 shade
mix(#000, red, 40%); 

または、Bourbonを使うとこの辺の便利なmixinが入っていますのでこう言うケースはBourbonなどを使うのが良いのかなと思っています。

明清色、暗清色を使用したい場合参考にしてみてください。
以上「Sass 明清色(tint)、暗清色(shade)を表現する」でした。


関連するタグ

CSS

この記事を書いた人

たむら しょうご

HTML&CSSコーダー

ウェブアクセシビリティ対応、フロントエンド開発、CMSを利用したウェブサイト制作を担当しています。
趣味はガーデニングです。

ましじめのスキルが必要ですか?

遠慮なくご相談ください。我々はあなたのプロジェクトに最善を尽くし、あなたのウェブサイトの制作を強力にサポートいたします。

お問い合わせはこちらから