HSL έως HEX

Σύγκριση HSL με HEX

Το CSS 3 εισάγει έναν άλλο τρόπο για τον καθορισμό του χρώματος χρησιμοποιώντας το HSL (από τα Αγγλικά. Hue, Saturation, Lightness) είναι ένα μοντέλο στο οποίο το χρώμα καθορίζεται από τρεις παραμέτρους: απόχρωση, κορεσμός και ελαφρότητα. Ας ρίξουμε μια ματιά σε κάθε παράμετρο ξεχωριστά. Το βασικό πλεονέκτημα της HSL είναι η δυνατότητα καθορισμού χρωματικών χαρακτηριστικών ανεξάρτητα το ένα από το άλλο. Αυτό ανοίγει τεράστιες ευκαιρίες για εσάς. Μπορείτε εύκολα να κάνετε το χρώμα πιο φωτεινό, πιο σκούρο, πιο κορεσμένο ή ακόρεστο. Και διατηρώντας τη σκιά του. Ή το αντίστροφο - αλλάξτε τις αποχρώσεις χωρίς να αλλάξετε τον κορεσμό ή τη φωτεινότητα τους. Συχνά, οι προεπεξεργαστές χρησιμοποιούνται για τη χρήση τέτοιων δυνατοτήτων, αλλά είναι δυνατό χωρίς αυτά. Η συνάρτηση hsl () χρησιμοποιείται για τον καθορισμό χρωμάτων HSL. Η συνάρτηση παίρνει τρεις τιμές, διαχωρισμένες με κόμμα: Απόχρωση, Κορεσμός και Φως. Αλλάζοντας τις τιμές κορεσμού και φωτεινότητας, μπορείτε να λάβετε παρακείμενες αποχρώσεις για ένα συγκεκριμένο χρώμα.

Στις περισσότερες περιπτώσεις, είναι δυνατή η αναγνώριση ενός χρώματος με έναν δεκαεξαδικό κώδικα, λαμβάνοντας υπόψη μόνο τα πρώτα ψηφία των ζευγών. Στο παρακάτω παράδειγμα, είναι σαφές ότι το χρώμα αναμιγνύεται με πολύ κόκκινο, λίγο μπλε και καθόλου πράσινο. Η κατανόηση του χρώματος με τον δεκαεξαδικό κώδικα επιτρέπει σε έναν σχεδιαστή Ιστού να πλοηγηθεί στον κώδικα της σελίδας πιο γρήγορα και, επιπλέον, μπορείτε πάντα να εντυπωσιάζετε συναδέλφους ή πελάτες λέγοντας Αχ, τι θαυμάσια σκιά μπορντό. Μπορείτε επίσης να αλλάξετε εύκολα τη φωτεινότητα, την απόχρωση ή τον κορεσμό ενός χρώματος με την επεξεργασία μόνο του δεκαεξαδικού κώδικα. Στο πρώτο παράδειγμα παρακάτω, ένα από τα ζεύγη αλλάζει σε βήματα 10%, ενώ η φωτεινότητα των χρωμάτων αυξάνεται. Στο δεύτερο παράδειγμα, η φωτεινότητα αυξάνεται, αλλά ο κορεσμός πέφτει. Οι τιμές RGB μπορούν επίσης να καθοριστούν χρησιμοποιώντας δεκαεξαδικές (HEX) τιμές χρώματος με τη μορφή: #RRGGBB, όπου RR (κόκκινο), GG (πράσινο) και BB (μπλε) είναι δεκαεξαδικές τιμές από 00 έως FF (οι ίδιες με τις δεκαδικές 0- 255). Το δεκαεξαδικό σύστημα, σε αντίθεση με το δεκαδικό σύστημα, βασίζεται, όπως υποδηλώνει το όνομά του, στον αριθμό 16.