【CSS入門】カラーコードの指定方法を解説

プログラミング言語の辞書

CSSでのカラーコード指定方法について簡潔に解説します。

カラーコードの形式

カラーコードの形式には以下のようなものがあります。

16進数カラーコード(Hex)

形式: #RRGGBBまたは#RGB
例: #FFFFFF(白)、#000000(黒)

RGBカラーコード

形式: rgb(赤, 緑, 青)
例: rgb(255, 0, 0)(赤)

RGBAカラーコード

形式: rgba(赤, 緑, 青, アルファ)
透明度を0から1で指定します。
例: rgba(255, 0, 0, 0.5)(半透明の赤)

HSLカラーコード

形式: hsl(色相, 彩度, 明度)
例: hsl(120, 100%, 50%)(緑)

HSLAカラーコード

形式: hsla(色相, 彩度, 明度, アルファ)
例: hsla(120, 100%, 50%, 0.5)(半透明の緑)

カラーネーム

標準の色名を使用することもできます。例: red、blue、greenなど。

カラーコードを使うと、ウェブデザインの自由度が高まり、一貫したスタイルを簡単に適用できます。