Utilore

Konverter kode warna

Ketik warna dalam notasi umum mana pun: #1f5fd6, 1f5fd6, #1f5, rgb(31, 95, 214). Semua bentuk lainnya muncul sekaligus, lengkap dengan angka kontras yang Anda butuhkan agar teks tetap terbaca.

  • #1f5fd6 HEX
  • rgb(31, 95, 214) RGB
  • hsl(219, 75%, 48%) HSL

Kontras:

Cara pakai

  1. Ketik atau tempel warnanya, atau pilih lewat kotak pemilih.
  2. Baca HEX, RGB, dan HSL berdampingan.
  3. Salin notasi yang dibutuhkan berkas Anda.

Perlu diketahui

Tiga notasi untuk warna yang sama

HEX ringkas dan berlaku di mana-mana dalam CSS. RGB menyebut kanalnya secara terbuka, dan itu penting ketika sebuah nilai dihitung alih-alih ditulis tangan. HSL menjelaskan rona, kejenuhan, dan kecerahan: inilah bentuk yang dipakai kalau Anda ingin warna yang sama tetapi satu tingkat lebih terang, karena Anda mengubah satu angka alih-alih menebak tiga.

Kontras bukan hiasan

Menurut WCAG, teks isi butuh rasio minimal 4,5:1 terhadap latarnya, dan teks berukuran besar minimal 3:1. Dua angka yang ditampilkan di sini langsung memberi tahu apakah warna ini sanggup menopang teks putih, teks hitam, atau tidak keduanya, sebelum desainnya sampai ke tangan pengembang.

Sumber

Pertanyaan umum

Format apa saja yang diterima?

HEX tiga, empat, enam, dan delapan digit, dengan atau tanpa tanda pagar, ditambah rgb() dan rgba() dengan koma atau spasi. Nilai alfa dipertahankan dan ditampilkan pada nilai HEX.

Kenapa HSL kadang menunjukkan warna yang sedikit berbeda?

Nilai HSL dibulatkan ke bilangan bulat agar mudah dibaca, jadi konversi bolak-balik bisa bergeser satu satuan pada salah satu kanal. Nilai HEX dan RGB tetap persis.

Apakah ada yang dikirim ke server?

Tidak. Semuanya dihitung di halaman ini: warna merek dari desain yang belum dirilis tetap ada di komputer Anda.

Alat terkait