Jak używać
- Wpisz kod koloru lub nazwę CSS i kliknij „Zastosuj”.
- Ustaw kolor w polu „Porównaj z”, aby sprawdzić kontrast dla wybranej pary kolorów.
- Naciśnij Ctrl+Shift+C (Cmd+Shift+C na Macu), aby skopiować aktualny HEX. Upewnij się, że żaden tekst nie jest zaznaczony.
- Kliknij „Kopiuj link”, aby udostępnić adres strony z wybranym kolorem.
Przykłady
Kolor marki do arkusza CSS
Dane wejściowe
#2451E8
Wynik
HEX: #2451E8 RGB: rgb(36, 81, 232) HSL: hsl(226, 81%, 53%) HSV: hsv(226, 84%, 91%) CMYK: cmyk(84%, 65%, 0%, 9%) Nazwa: ≈ MediumSlateBlue na białym: 6.14:1 — ✓ AA, ✓ AA (duży tekst), ✕ AAA, ✓ AAA (duży tekst) na czarnym: 3.41:1 — ✕ AA, ✓ AA (duży tekst), ✕ AAA, ✕ AAA (duży tekst)
Szary tekst na białym tle
Dane wejściowe
#767676
Wynik
HEX: #767676 RGB: rgb(118, 118, 118) HSL: hsl(0, 0%, 46%) HSV: hsv(0, 0%, 46%) CMYK: cmyk(0%, 0%, 0%, 54%) Nazwa: ≈ Gray (grey) na białym: 4.54:1 — ✓ AA, ✓ AA (duży tekst), ✕ AAA, ✓ AAA (duży tekst) na czarnym: 4.62:1 — ✓ AA, ✓ AA (duży tekst), ✕ AAA, ✓ AAA (duży tekst)
Wartości RGB z projektu graficznego
Dane wejściowe
rgb(255 136 0)
Wynik
HEX: #FF8800 RGB: rgb(255, 136, 0) HSL: hsl(32, 100%, 50%) HSV: hsv(32, 100%, 100%) CMYK: cmyk(0%, 47%, 100%, 0%) Nazwa: ≈ DarkOrange na białym: 2.39:1 — ✕ AA, ✕ AA (duży tekst), ✕ AAA, ✕ AAA (duży tekst) na czarnym: 8.77:1 — ✓ AA, ✓ AA (duży tekst), ✓ AAA, ✓ AAA (duży tekst)
Nazwy kolorów HTML (148)
Wszystkie 148 nazw kolorów CSS obsługiwanych przez nowoczesne przeglądarki, pogrupowane według rodzin. Kliknij wiersz, aby wczytać kolor, lub kliknij wartość HEX albo RGB, aby ją skopiować.
| Kolor | Nazwa | HEX | RGB |
|---|
FAQ
Co oznacza znak ≈ przy nazwie koloru?
Oznacza najbliższą z 148 nazw kolorów CSS, a nie dokładne dopasowanie. Narzędzie wybiera ją na podstawie odległości kolorów w przestrzeni CIE Lab.
Czy mogę użyć kodu HEX z przezroczystością?
Możesz go wpisać, ale kanał alfa zostanie pominięty, a narzędzie wyświetli komunikat. Wyniki dotyczą wyłącznie nieprzezroczystych kolorów sRGB.
Czy wartości CMYK nadają się do druku?
Wartości CMYK są przybliżone i obliczane bez profilu kolorów. Do przygotowania pliku do druku użyj profilu wskazanego przez drukarnię.
Dlaczego nie widzę przycisku „Pobierz z ekranu”?
Przycisk pojawia się tylko w przeglądarkach obsługujących EyeDropper API, w pozostałych jest ukryty.