Μετατροπέας Χρωμάτων
Εισαγάγετε έναν κωδικό χρώματος hex για να δείτε τα αντίστοιχα RGB και HSL με τις τιμές των καναλιών κόκκινου, πράσινου και μπλε.
Πώς να χρησιμοποιήσετε αυτόν τον μετατροπέα χρωμάτων
- Εισαγάγετε τον δεκαεξαδικό κωδικό χρώματος
Πληκτρολογήστε έναν 6ψήφιο δεκαεξαδικό κωδικό στο πεδίο Hex (π.χ. FF6B35 ή 00FF88). Παραλείψτε το σύμβολο #.
- Δείτε τις τιμές RGB
Τα αποτελέσματα για τα κανάλια Red, Green και Blue δείχνουν τις τιμές 0–255 για κάθε στοιχείο.
- Ελέγξτε την έξοδο HSL
Δείτε το αποτέλεσμα HSL για την απόχρωση (0–360°), τον κορεσμό και τη φωτεινότητα — χρήσιμο για προσαρμογές χρωμάτων.
Πώς λειτουργεί αυτός ο μετατροπέας χρωμάτων
Αυτό το εργαλείο μετατρέπει έναν δεκαεξαδικό κωδικό χρώματος σε αναπαραστάσεις RGB (κόκκινο, πράσινο, μπλε) και HSL (απόχρωση, κορεσμός, φωτεινότητα). Κάθε δεκαεξαδικό ζεύγος αντιστοιχεί σε μια τιμή καναλιού 8-bit (0–255) και η μετατροπή HSL χρησιμοποιεί τυπικά μαθηματικά χρωματικού χώρου.
R = hex[0:2] → δεκαδικό, G = hex[2:4] → δεκαδικό, B = hex[4:6] → δεκαδικό Hex #FF6B35 → RGB(255, 107, 53) → HSL(16, 100%, 60%).
Hex 000000 → RGB(0, 0, 0) → HSL(0, 0%, 0%) — καθαρό μαύρο.
Hex FFFFFF → RGB(255, 255, 255) → HSL(0, 0%, 100%) — καθαρό λευκό. Hex 808080 → RGB(128, 128, 128) → HSL(0, 0%, 50%) — μεσαίο γκρι.
- ✓ Η είσοδος είναι ένας έγκυρος 6-ψήφιος δεκαεξαδικός κωδικός χρώματος.
- ✓ Το κανάλι Alpha δεν υποστηρίζεται σε αυτήν την έκδοση.
- Η μετατροπή CMYK απαιτεί χρωματικό προφίλ και δεν περιλαμβάνεται εδώ.
Κατανόηση των χρωματικών μοντέλων
Τα HEX, RGB και HSL είναι διαφορετικοί τρόποι περιγραφής του ίδιου χρώματος. Το HEX κωδικοποιεί το RGB ως μια 6ψήφια δεκαεξαδική συμβολοσειρά: κάθε ζεύγος χαρακτήρων είναι ένα κανάλι 8-bit (0–255). Το RGB εκφράζει τις ίδιες τιμές ως τρεις αριθμούς, τα προσθετικά πρωτεύοντα χρώματα που εκπέμπουν οι οθόνες. Το HSL (Hue, Saturation, Lightness) είναι ένα κυλινδρικό μοντέλο: η απόχρωση είναι η γωνία στον χρωματικό κύκλο (0° κόκκινο, 120° πράσινο, 240° μπλε), ο κορεσμός είναι η ένταση του χρώματος και η φωτεινότητα είναι η λαμπρότητα. Οι σχεδιαστές συχνά προτιμούν το HSL όταν προσαρμόζουν χρώματα μέσω προγραμματισμού — η αλλαγή μόνο της φωτεινότητας σκουραίνει ή φωτίζει το χρώμα χωρίς να αλλάζει η απόχρωση, ενώ η ρύθμιση του κορεσμού προσαρμόζει τη ζωντάνια.
Περιπτώσεις χρήσης μετατροπής χρωμάτων για προγραμματιστές
Οι προγραμματιστές μετατρέπουν χρώματα κατά τη δημιουργία συστημάτων σχεδίασης, την υλοποίηση θεμάτων, τη δημιουργία χρωματικών παλετών και την αποσφαλμάτωση CSS. Τα design tokens συχνά αποθηκεύουν χρώματα σε hex. Η μετατροπή σε RGB ή HSL επιτρέπει υπολογισμούς κατά τον χρόνο εκτέλεσης, όπως επικαλύψεις αδιαφάνειας ή ελέγχους προσβασιμότητας αντίθεσης. Οι εναλλαγείς θεμάτων μπορεί να χρειαστεί να παράγουν πιο ανοιχτές ή σκούρες παραλλαγές από ένα βασικό χρώμα χρησιμοποιώντας HSL. Τα αυτοματοποιημένα εργαλεία προσβασιμότητας μετατρέπουν τα χρώματα για να υπολογίσουν την αναλογία φωτεινότητας και αντίθεσης. Κατά την αποσφαλμάτωση σφαλμάτων διάταξης ή θεμάτων, η προβολή μιας τιμής hex ως RGB ή HSL βοηθά στον εντοπισμό του καναλιού που ευθύνεται. Η μετατροπή χρωμάτων χρησιμοποιείται επίσης στην οπτικοποίηση δεδομένων, σε βιβλιοθήκες γραφημάτων και στη δυναμική θεματοποίηση UI.
Συχνές ερωτήσεις
Μπορώ να εισαγάγω έναν 3-ψήφιο κωδικό hex;
Προς το παρόν, αυτό το εργαλείο απαιτεί 6-ψήφιο κωδικό. Για 3-ψήφιες συντομογραφίες όπως το F60, επεκτείνετέ τις πρώτα σε FF6600.
Τι είναι το HSL;
Το HSL σημαίνει Hue (Απόχρωση), Saturation (Κορεσμός), Lightness (Φωτεινότητα). Είναι ένας εναλλακτικός τρόπος περιγραφής χρωμάτων που ορισμένοι σχεδιαστές βρίσκουν πιο διαισθητικό από το RGB.