Czym jest kod koloru szesnastkowego?

Kod koloru szesnastkowego zapisuje kolor za pomocą cyfr szesnastkowych, tak jak robi to CSS i większość narzędzi do projektowania. W zapisie #3b82f6 każda para cyfr oznacza jeden kanał: 3b to czerwony, 82 to zielony, a f6 to niebieski — od 00 (wyłączony) do ff (pełna wartość). Opcjonalna czwarta para określa kanał alfa, czyli krycie, więc #3b82f6cc oznacza ten sam niebieski kolor przy kryciu 80%. Kody, w których każda para zawiera powtórzoną cyfrę, można skrócić do trzech lub czterech cyfr, dlatego #ff8800 można również zapisać jako #f80.

Opis narzędzia

To narzędzie pozwala edytować kod koloru szesnastkowego para po parze. Wpisz lub wklej kod, wybierz kolor albo wklej go w formacie RGB, HSL lub innym, a następnie zmień pary czerwonego, zielonego, niebieskiego i alfa albo wartość krycia, aby zobaczyć wynik na szachownicy przezroczystości. Edytowany kolor jest wyświetlany w formatach szesnastkowych używanych przez CSS, Androida i kod, a każdy z nich można od razu skopiować.

Funkcje

  • Edytowanie 3-, 4-, 6- i 8-cyfrowych kodów szesnastkowych, z # lub bez
  • Zmiana każdego kanału jako dwucyfrowej pary szesnastkowej oraz kanału alfa jako pary szesnastkowej lub wartości procentowej
  • Wybieranie koloru albo wklejanie go w formacie RGB, HSL lub innym przy zachowaniu kanału alfa
  • Podgląd przezroczystych kolorów na tle w szachownicę
  • Pobieranie koloru jako 6-cyfrowego HEX, 8-cyfrowego HEX, krótkiego HEX, rgb() lub rgba(), #AARRGGBB oraz 0xAARRGGBB
  • Przełączanie między małymi a wielkimi literami cyfr szesnastkowych
  • Działa w przeglądarce

Jak to działa

Kod 3- lub 4-cyfrowy jest rozwijany przez podwojenie każdej cyfry, a kod bez pary alfa jest w pełni nieprzezroczysty (ff). Pojedyncza cyfra wpisana w polu kanału jest traktowana jako 0 poprzedzające tę cyfrę, więc f oznacza 0f. Wartości procentowe krycia są zaokrąglane do najbliższej wartości alfa z zakresu od 0 do 255, dlatego 80% staje się cc (204). Krótka forma jest dostępna tylko wtedy, gdy obie cyfry każdej pary są takie same; w przeciwnym razie dane pole pozostaje puste.

Wskazówki

  • CSS odczytuje parę alfa na końcu (#RRGGBBAA), natomiast zasoby kolorów Androida i .NET umieszczają ją na początku (#AARRGGBB), dlatego w ich przypadku wybierz pola ARGB.
  • Pozostaw kanał alfa ustawiony na ff, aby uzyskać zwykły kod 6-cyfrowy; pola 8-cyfrowe i ARGB nadal będą wyświetlać pełny zapis.