Nilai hex ARGB transparan

160

Warna-warna di ini tabel semua tidak transparan. Saya kira nilai untuk Adiatur ke FF.

Apa kode untuk transparansi?

Misalnya warna ini FFF0F8FF (AliceBlue), ke kode transparan seperti ??F0F8FF?

pengguna3332579
sumber
Akhirnya ada cara untuk mengatur warna transparan dengan kode hex untuk browser tertentu (fitur baru). Silakan, lihat stackoverflow.com/a/60876347/2457251
Almir Campos

Jawaban:

199

Transparansi dikendalikan oleh saluran alfa ( AAin #AARRGGBB). Nilai maksimal (255 dec, FF hex) berarti sepenuhnya buram. Nilai minimum (0 des, 00 hex) berarti sepenuhnya transparan. Nilai-nilai di antaranya semi-transparan, yaitu warnanya dicampur dengan warna latar belakang.

Untuk mendapatkan warna yang sepenuhnya transparan, atur alpha ke nol. RR, GGdan BBtidak relevan dalam kasus ini karena tidak ada warna yang akan terlihat. Ini berarti #00FFFFFF("transparan Putih") adalah warna yang sama dengan #00F0F8FF("transparan AliceBlue"). Untuk membuatnya tetap sederhana, pilih yang hitam ( #00000000) atau putih ( #00FFFFFF) jika warnanya tidak masalah.

Di tabel yang Anda tautkan ke Anda akan menemukan Transparentdidefinisikan sebagai #00FFFFFF.

theHacker
sumber
2
katakanlah saya perlu opacity 50%. Apa kode untuk warna putih dengan opacity 50% / transparan?
user3332579
10
@ user3332579: 50% adalah 7F. Masukkan kalkulator Anda dalam mode hex, itu akan melakukan trik untuk Anda.
theHacker
1
@ user3332579: Jadi 50% putih adalah #7FFFFFFF.
theHacker
6
Formatnya adalah #RRGGBBAA Hex8 (atau #RGBA di Hex4) dan BUKAN #AARRGGBB (atau #ARGB) yang telah saya uji di Chrome 62,63,64 Lihat CanIUse.com , https://css-tricks.com/8- digit-hex-codes / , Status Fitur Chrome
SGS Sandhu
3
@SGSSandhu Pertanyaan ini tidak ditargetkan untuk CSS. Lihat lagi pertanyaannya, formatnya adalah ARGB.
theHacker
506

Berikut adalah tabel dari nilai% ke nilai hex:

Contoh : Untuk 85% putih, Anda akan menggunakan #D9FFFFFF. Di sini 85% = "D9" & Putih = "FFFFFF"


100% — FF
95% — F2
90% — E6

85% — D9

80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00

Bagaimana cara menghitungnya?

FF adalah angka yang ditulis dalam mode hex. Angka itu mewakili 255 dalam desimal. Misalnya, jika Anda ingin menghitung 42%, Anda perlu menemukan 42% dari numbeer 255 dan mengonversi angka itu menjadi hex. 255 * 0,42 ~ = 107 107 ke hex adalah "6B - maleta

Shivaraj Patil
sumber
3
bagaimana Anda menghitung ini?
Saeed Jassani
35
@SaeedJassani FF adalah angka yang ditulis dalam mode hex. Angka itu mewakili 255 dalam desimal. Misalnya, jika Anda ingin menghitung 42%, Anda perlu menemukan 42% dari numbeer 255 dan mengonversi angka itu menjadi hex. 255 * 0.42 ~ = 107 107 ke hex adalah "6B"
maleta
1
@Maleta Terima kasih banyak
Saeed Jassani
10

Menambahkan ke jawaban lain dan tidak melakukan apa-apa lagi dari apa yang @Maleta jelaskan dalam komentar di https://stackoverflow.com/a/28481374/1626594 , lakukan alpha * 255 lalu bulatkan kemudian hex . Inilah konverter cepat http://jsfiddle.net/8ajxdLap/4/

function rgb2hex(rgb) {
  var rgbm = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?((?:[0-9]*[.])?[0-9]+)[\s+]?\)/i);
  if (rgbm && rgbm.length === 5) {
    return "#" +
      ('0' + Math.round(parseFloat(rgbm[4], 10) * 255).toString(16).toUpperCase()).slice(-2) +
      ("0" + parseInt(rgbm[1], 10).toString(16).toUpperCase()).slice(-2) +
      ("0" + parseInt(rgbm[2], 10).toString(16).toUpperCase()).slice(-2) +
      ("0" + parseInt(rgbm[3], 10).toString(16).toUpperCase()).slice(-2);
  } else {
    var rgbm = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
    if (rgbm && rgbm.length === 4) {
      return "#" +
        ("0" + parseInt(rgbm[1], 10).toString(16).toUpperCase()).slice(-2) +
        ("0" + parseInt(rgbm[2], 10).toString(16).toUpperCase()).slice(-2) +
        ("0" + parseInt(rgbm[3], 10).toString(16).toUpperCase()).slice(-2);
    } else {
      return "cant parse that";
    }
  }
}

$('button').click(function() {
  var hex = rgb2hex($('#in_tb').val());
  $('#in_tb_result').html(hex);
});
body {
  padding: 20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Convert RGB/RGBA to hex #RRGGBB/#AARRGGBB:<br>
<br>
<input id="in_tb" type="text" value="rgba(200, 90, 34, 0.75)"> <button>Convert</button><br>
<br> Result: <span id="in_tb_result"></span>

Komunitas
sumber
2

Gunakan ini saja:

android: background = "# 00FFFFFF"

itu akan melakukan pekerjaan Anda.

Aditya Singh Rajput
sumber
1

Jika Anda memiliki nilai hex, dan Anda hanya ingin tahu apa nilai alpha tersebut, cuplikan ini dapat membantu:

const alphaToHex = (alpha => {
  if (alpha > 1 || alpha < 0 || isNaN(alpha)) {
    throw new Error('The argument must be a number between 0 and 1');
  }
  return Math.ceil(255 * alpha).toString(16).toUpperCase();
})

console.log(alphaToHex(0.45));

Raphael Aleixo
sumber