2025年11月27日(木)
CSSで最近よく使うOKLCHカラーについて理解を深めよう、異なる色でトーンを合わせたり、単色のシェードも簡単
CSSでは、さまざまなカラーモデルで色を設定できます。16進数によるHEX値、rgb()によるRGB値、hsl()によるHSL値、lab()によるLAB値、oklch()Oklch値、oklab()によるOklab値など、現在ではすべてのブラウザにサポートされています。
中でも最近では、トーンを合わせたカラーを簡単に作ることができるOKLCHカラーの人気が高まっています。このOKLCHカラーについて紹介します。
oklch.fyi
下記は各ポイントを意訳したものです。
※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。
author:
コリス
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログ
‹ PREVSlackのつぶやきを自動でNotion日記にするツールを作った話
NEXT ›
ブロックチェーンを使ったオープンソースの分散型クラウドストレージ・「Essentialis Cloud」
関連記事
CSSの進化は止まらない！ コンテナクエリとif()関数がさらに便利になり、興味を示したときに反応する新属性など、Chrome 142で新しく追加された9個のCSSの機能
CSSの新しい関数「color-scheme()」を使用すると、カスタム関数であらゆる型の値を設定できるようになります
小規模なアップデートだけど、Web制作者は要チェック！ Chrome 141で新しく追加されたCSSとUIに関する機能
役に立つコンテンツを作る10の方法 + 事例とチェックリスト
CSSの進化が止まらない！ 自分でオリジナルの関数を定義できるようになります、Chrome 139で新しく追加された6個のCSSの機能
Ads
2006年の開設以来、一貫してサイト制作に関する最新情報を提供しているクリエイティブブログコリスの記事『CSSで最近よく使うOKLCHカラーについて理解を深めよう、異なる色でトーンを合わせたり、単色のシェードも簡単』についてまとめています。
この記事は特にSVG・SEO・Chromeについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のコリスで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとコリスの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
0
8
212
0
