HTML CSS JAVASCRIPT SQL PYTHON PHP HOW TO W3.CSS JAVA JQUERY C++ R React
ภาษาไทย Afrikaans العربية čeština Deutsch Español Français हिन्दी Bahasa Indonesia Italiano 日本語 한국어 မြန်မာဘာသာ Nederlands Polski Português Русский Türkçe Tiếng Việt

Kolory HSL

❮ Poprzedni Następny ❯

Kalkulator HSL


 
rgb(255, 0, 0)
#ff0000

H:
S:
L:

Kolory HSL

Wartości kolorów HSL są obsługiwane w przeglądarkach IE9+, Firefox, Chrome, Safari i Opera 10+.

HSL oznacza odcień, nasycenie i lekkość.

Wartości kolorów HSL są określone za pomocą: .hsl(hue, saturation, lightness)

Odcień

Barwa to stopień na kole kolorów od 0 do 360. 0 to czerwony, 120 to zielony, 240 to niebieski.

Nasycenie

Nasycenie to wartość procentowa; 0% oznacza odcień szarości, a 100% to pełny kolor.

Lekkość

Lekkość to również procent; 0% to czarny, 100% to biały.

"; } x += ""; x += ""; n = 0; for (i = 0; i "; } x += ""; x += ""; document.getElementById("huetable"). innerHTML = x; } function drawSatTable(hue) { var x, i; x = "" x += ""; for (i = 0; i "; } x += ""; x += ""; for ( i = 0; i "; } x += "
" + i + "
"; document.getElementById("saturationtable").innerHTML = x; } function drawLigTable(hue) { var x, i; x = "" x += ""; for (i = 0; i "; } x += ""; x += ""; for (i = 0; i "; } x += "
" + i + "
"; document.getElementById("lightnesstable").innerHTML = x; } drawHueTable(0); drawSatTable(0); drawLigTable(0);

Spróbuj sam

Wartości kolorów HSL są obsługiwane we wszystkich głównych przeglądarkach.

Przykład

<style>
div {
    background-color: hsl(180, 50%, 50%);
    color: hsl(0, 0%, 100%);
}
</style>

❮ Poprzedni Następny ❯