Χρώματα HSL CSS
- Προηγούμενη Σελίδα Χρώματα HEX CSS
- Επόμενη Σελίδα Φόντο CSS
Τιμή HSL
Στο CSS, μπορείτε να καθορίσετε το χρώμα χρησιμοποιώντας τον τόνο, την συχνότητα και την ένταση (HSL), με τη μορφή:
hsla(hue, saturation, lightness)
Χρώμα (hue)είναι το βαθμό από το 0 έως το 360 του κύκλου των χρωμάτων. Το 0 είναι το κόκκινο, το 120 είναι το πράσινο, και το 240 είναι το μπλε.
Συχνότητα (saturation)είναι ποσοστό, το 0% σημαίνει σκιά του γκρι, ενώ το 100% είναι το πλήρες χρώμα.
Ένταση (lightness)είναι επίσης ποσοστό, το 0% είναι μαύρο, το 50% είναι τόσο σκοτεινό όσο και φωτεινό, και το 100% είναι λευκό.
Προτείνουμε να κάνετε δοκιμές με τη μείξη των παρακάτω τιμών HSL:
HUE
SATURATION
LIGHTNESS
Παράδειγμα
Συχνότητα
Η συχνότητα μπορεί να περιγραφεί ως η ένταση του χρώματος.
Το 100% είναι καθαρό χρώμα, χωρίς σκιά του γκρι
Το 50% είναι 50% γκρι, αλλά μπορείτε να δείτε το χρώμα.
Το 0% είναι πλήρως γκρι, δεν μπορείτε να δείτε χρώμα.
Παράδειγμα
Ένταση
Η ένταση του χρώματος μπορεί να περιγραφεί ως πόσο φως θέλουμε να δώσουμε στο χρώμα, όπου το 0% σημαίνει μη φωτεινό (μαύρο), το 50% σημαίνει 50% φωτεινό (ни тёмное, ни светлое), και το 100% σημαίνει πλήρη φωτεινότητα (λευκό).
Παράδειγμα
Γενικά, ορίζεται η σκιά του γκρι ρυθμίζοντας τον τόνο και την συχνότητα σε 0 και προσαρμόζοντας την ένταση από 0% έως 100% για να πάρουμε πιο βαθιές ή πιο λεπτές σκιάς:
Παράδειγμα
Τιμή HSLA
Η τιμή χρώματος HSLA είναι η επέκταση της τιμής χρώματος HSL με κανάλι ανοιχτότητας - καθορίζει την αδιαφάνεια του χρώματος.
Η τιμή χρώματος HSLA καθορίζεται ως:
hsla(hue, saturation, lightness, alpha)
alpha Οι παραμέτρους είναι αριθμοί μεταξύ 0.0 (πλήρως διαφανής) και 1.0 (πλήρως αδιαφανής):
Παρακαλώ δοκιμάστε τη μείξη των παρακάτω τιμών HSLA:
HUE
SATURATION
LIGHTNESS
ALPHA
Παράδειγμα
- Προηγούμενη Σελίδα Χρώματα HEX CSS
- Επόμενη Σελίδα Φόντο CSS