本記事では、HTMLで表示されている文字・テキストの色を変える方法について解説しています。文字の色を変えるHTMLで表示しているテキストの色を変更する場合、CSSのcolorプロパティを使います。color:値;}colorプロパティに設定できる値について見ていきましょう。色の指定方法1:キーワードカラーを指定する1つ目の方法、キーワードについて解説します。color:black;}キーワードでは、あらかじめ決められた色を「black」や「white」などの名詞で指定します。直感的で分かりやすいですが、キーワードでは表現できない微妙な色合いを指定することができないため、実務ではあまり使われることが少ないです。キーワードで指定できる色名はMDNに記載されています。キーワードを使用して文字の色を変更したサンプルコードと実行結果は以下のとおりです。CodePen.色の指定方法2:16進数カラーを指定する2つ目の方法、16進数について解説します。カラーコード」という形式で記述します。記述する桁数は6桁で「最初の2文字が赤」「次の2文字が緑」「最後の2文字が青」を表しています。「#ff0000」や「#881144」などの同じ英数字が連続している場合は「#f00」「#814」に省略することが出来ます。最初は見慣れない形で戸惑い敬遠しがちですが、Photoshopなどのデザインツールでは16進数でカラーコードを指定するのが当たり前なので、実務では一番使われるカラー指定の方法です。CSS」などで調べてヒットするものは基本的に16進数やRGBで数値が書かれていることがほとんどです。16進数を使用して文字の色を変更したサンプルコードと実行結果は以下のとおりです。CodePen.色の指定方法3:RGBカラーを指定する3つ目の方法、RGBについて解説します。0);}RGBは3つの引数に色を指定します。16進数と色の配置は同じで「第1引数に赤色」「第2引数に緑色」「第3引数に青色」を表しています。RGBには透明度を付けることできます。透明度を付けるにはrgbではなく「rgba」を使い第4引数に不透明度を表す数値を指定します。数値は0〜1の間にある数値を指定することができ、数値が0に近づくほど透明になり1に近づくほど不透明になります。0.5);}RGBを使用して文字の色を変更したサンプルコードと実行結果は以下のとおりです。AGENTは、国内最大級の転職支援実績を持つIT・Web業界に強い転職エージェントです。詳細をみるフリーランス案件紹介サイトMidworksは豊富な案件と「フリーランス」と「正社員」の、良いとこ取りをした働き方を実現する手厚い保障が特徴のエージェントです。月額980円で読み放題。