Widely available YES。主要ブラウザで広く対応済み。本番利用を推奨。
構文・カスケード Widely available

Color

CSSの最も基本的なプロパティの一つで、テキストやボーダーの色を設定します。currentColor キーワードの値としても使用され、SVGの fill や border-color のデフォルト値にも影響します。キーワード、HEX、RGB、HSL、新しいカラースペース（oklch等）など多様な形式で色を指定できます。

カラーテキスト

概要

CSSの最も基本的なプロパティの一つで、テキストやボーダーの色を設定します。currentColor キーワードの値としても使用され、SVGの fill や border-color のデフォルト値にも影響します。キーワード、HEX、RGB、HSL、新しいカラースペース（oklch等）など多様な形式で色を指定できます。

対応ブラウザ

デスクトップ

Chrome 1+
Edge 12+
Safari 1+
Firefox 1+

モバイル

Chrome Android 18+
Safari iOS 1+
Firefox Android 4+

基本構文

CSS 
body {
  color: #333333;
}
a {
  color: oklch(0.5 0.2 240);
}

実務での使いどころ

  • サイト全体のテキストカラー設定

    body に color を設定することで、サイト全体の基本テキスト色を統一し、currentColor を通じてボーダーやSVGにも一貫した配色を適用できます。

注意点

  • color は多くの他のプロパティのデフォルト値に影響します（border-color、text-decoration-color、SVGの fill など）。変更時は意図しない副作用がないか確認してください。

アクセシビリティ

  • テキストの色と背景色のコントラスト比がWCAG 2.1の基準（通常テキスト4.5:1、大きなテキスト3:1）を満たすことを必ず確認してください。

参考リンク