Color HEX di CSS: Code dan Cara Membuatnya

Reviewed by Sutiono S.Kom., M.Kom., M.T.I

by Hanifah Nurbaeti October 12, 2020

Nilai HEX

Di CSS, warna dapat ditentukan menggunakan nilai heksadesimal dalam bentuk:

rrggbb

Di mana rr (merah), gg (hijau) dan bb (biru) adalah nilai heksadesimal antara 00 dan ff (sama dengan desimal 0-255).

Misalnya, # ff0000 ditampilkan sebagai merah, karena merah disetel ke nilai tertinggi (ff) dan lainnya disetel ke nilai terendah (00).

Contoh :

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color:#ff0000;">#ff0000</h1>
<h1 style="background-color:#0000ff;">#0000ff</h1>
<h1 style="background-color:#3cb371;">#3cb371</h1>
<h1 style="background-color:#ee82ee;">#ee82ee</h1>
<h1 style="background-color:#ffa500;">#ffa500</h1>
<h1 style="background-color:#6a5acd;">#6a5acd</h1>

<p> Dalam HTML, kita dapat menentukan warna menggunakan nilai Hex. </p>

</body>
</html>

Nuansa abu-abu sering ditentukan menggunakan nilai yang sama untuk ketiga warnanya:

Contoh :

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color:#000000;">#000000</h1>
<h1 style="background-color:#3c3c3c;">#3c3c3c</h1>
<h1 style="background-color:#787878;">#787878</h1>
<h1 style="background-color:#b4b4b4;">#b4b4b4</h1>
<h1 style="background-color:#f0f0f0;">#f0f0f0</h1>
<h1 style="background-color:#ffffff;">#ffffff</h1>
  
<p> Dengan menggunakan nilai yang sama untuk merah, hijau, dan biru, Anda akan mendapatkan nuansa abu-abu yang berbeda. </p>
</body>
</html>