HTML Color Codes

Pemilih Warna HTML untuk format RGB HEX HSL

Mendapatkan kod warna HTML CSS dengan mudah untuk laman web anda menggunakan pemilih warna, menukar format warna antara HEX, RGB, HSL, HSV.

Pilih Warna

Masukkan nilai warna

Atau gunakan pemilih HTML5

Warna Terpilih

Merah: 0
Hijau: 255
Biru: 255
HUE (Darjah): 180
Kecerahan: 0.7
Alpha: 1
Hex: #00ffff
RGB: rgb(0, 255, 255)
HSL: hsl(180, 100%, 50%)
Kumpulan Warna: Cyan
Kongsi:
Contoh warna CSS3

<style>
  div {
    color: #00ffff;
    color: rgb(0, 255, 255);
    color: hsl(180, 100%, 50%);
  }
</style>
Gaya Paling Gelap dan Paling Terang

<style>
  .darken {
    color: rgb(0, 230, 230);
  }
  .lighten {
    color: rgb(25, 255, 255);
  }
</style>

Dapatkan Warna dari Imej

get pixel color from pic

Pilih Warna dan buat Palet

select color and create palette

Apakah Kod Warna HTML?

Kod warna HTML adalah cara untuk menentukan warna dalam reka bentuk web. Kod-kod ini digunakan dalam HTML dan CSS untuk menentukan warna elemen seperti teks, latar belakang, sempadan, dan banyak lagi. Memahami kod warna HTML adalah penting untuk mencipta halaman web yang menarik dan konsisten secara visual.

Contohnya, warna merah boleh dikenal pasti menggunakan format berikut:

Jenis Kod Warna HTML


Kod Warna Hexadecimal:
  • Cara paling biasa untuk menentukan warna dalam HTML dan CSS adalah dengan menggunakan kod warna hexadecimal (hex). Kod warna hex adalah gabungan enam digit nombor dan huruf yang ditentukan oleh campuran komponen merah, hijau, dan biru (RGB).
  • Format: #RRGGBB
  • Contoh: #FF5733 mewakili warna oren.
  • Setiap pasangan digit sepadan dengan intensiti merah, hijau, dan biru masing-masing pada skala dari 00 (tiada intensiti) ke FF (intensiti penuh).
Kod Warna RGB:
  • Kod warna RGB menentukan warna berdasarkan komponen merah, hijau, dan biru mereka.
  • Format: rgb(merah, hijau, biru)
  • Contoh: rgb(255, 87, 51) adalah setara RGB dengan #FF5733.
  • Setiap komponen (merah, hijau, dan biru) dinyatakan sebagai nombor antara 0 dan 255
Kod Warna RGBA:
  • Serupa dengan RGB, tetapi termasuk komponen alpha untuk kelegapan.
  • Format: rgba(merah, hijau, biru, alpha)
  • Contoh: rgba(255, 87, 51, 0.5) menentukan warna yang sama dengan kelegapan 50%.
Kod Warna HSL:
  • HSL bermaksud Hue, Saturation, dan Lightness.
  • Format: hsl(hue, saturation%, lightness%)
  • Contoh: hsl(9, 100%, 60%) adalah cara lain untuk mewakili warna #FF5733
  • Hue adalah darjah pada roda warna (dari 0 hingga 360), ketepuan adalah peratusan (0% adalah grayscale, 100% adalah warna penuh), dan kecerahan juga adalah peratusan (0% adalah hitam, 100% adalah putih).
Kod Warna HSLA:
  • Serupa dengan HSL, tetapi termasuk komponen alpha untuk kelegapan.
  • Format: hsla(hue, saturation%, lightness%, alpha)
  • Contoh: hsla(9, 100%, 60%, 0.5) menentukan warna yang sama dengan kelegapan 50%.
Menggunakan Kod Warna HTML:

Kod warna HTML boleh digunakan dalam pelbagai sifat CSS untuk gaya elemen web. Sebagai contoh:

<style>
    .text-color {
        color: #FF5733;
    }
    .background-color {
        background-color: rgb(255, 87, 51);
    }
    .border-color {
        border: 2px solid hsl(9, 100%, 60%);
    }
</style>
<p class="text-color">This text is orange.</p>
<div class="background-color">This background is orange.</div>
<div class="border-color">This border is orange.</div>

Dalam contoh ini teks, latar belakang, dan sempadan diatur gaya menggunakan pelbagai jenis kod warna HTML, semuanya mewakili warna oren yang sama.

Kod warna HTML adalah aspek asas dalam reka bentuk web, membolehkan pembangun menentukan dan memanipulasi warna dengan tepat. Dengan memahami kod warna hex, RGB, RGBA, HSL, dan HSLA, anda boleh mencipta halaman web yang padu dan menarik secara visual yang meningkatkan pengalaman pengguna.