Μετατροπέας HSL σε HEX
Ορίστε απόχρωση, κορεσμό και φωτεινότητα και πάρτε τον αντίστοιχο εξαψήφιο κωδικό χρώματος HEX, έτοιμο για αντιγραφή.
Εισαγωγή hsl
Αποτέλεσμα · HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Τρόπος χρήσης: HSL σε HEX
- 1
Εισαγάγετε ένα χρώμα
Πληκτρολογήστε έναν κωδικό χρώματος ή επιλέξτε χρώμα με τον επιλογέα — κάθε πεδίο δέχεται τη μορφή που εμφανίζει.
- 2
Δείτε τη μετατροπή
Το αποτέλεσμα ενημερώνεται αμέσως καθώς πληκτρολογείτε, μαζί με ζωντανή προεπισκόπηση του χρώματος.
- 3
Αντιγράψτε τον κωδικό
Αντιγράψτε την τιμή που χρειάζεστε με ένα κλικ και επικολλήστε την στο σχέδιό σας, στο CSS ή στις ρυθμίσεις εκτύπωσης.
Γιατί να μετατρέψετε HSL σε HEX
Το HSL είναι ο πιο διαισθητικός τρόπος για να δημιουργήσετε ένα σύστημα χρωμάτων. Ορίζετε μια απόχρωση, ας πούμε 262° για το βιολετί, και φτιάχνετε ολόκληρη κλίμακα αλλάζοντας κυρίως τη φωτεινότητα: γύρω στο 95% για φόντα, 58% για κουμπιά και τόνους έμφασης, 30% για κείμενο. Σχεδιαστές και προγραμματιστές χρησιμοποιούν αυτή τη μέθοδο για ανοιχτές και σκούρες αποχρώσεις και σκοτεινά θέματα.
Η τελική κλίμακα, ωστόσο, συνήθως πρέπει να παραδοθεί ως κωδικοί HEX: οδηγοί στυλ, design tokens, βιβλιοθήκες Figma, εγχειρίδια εταιρικής ταυτότητας και πολλά συστήματα διαχείρισης περιεχομένου περιμένουν τιμές #RRGGBB. Εισαγάγετε τις τιμές HSL και αντιγράψτε το αποτέλεσμα HEX — το hsl(262, 83%, 58%), για παράδειγμα, γίνεται #7C3BED. Το εργαλείο δείχνει επίσης RGB, HSV και CMYK για το ίδιο χρώμα. Επειδή το HEX αποθηκεύει μόνο 256 επίπεδα ανά κανάλι, πολύ μικρές αλλαγές στο HSL δεν αλλάζουν πάντα τον κωδικό HEX.
Όλα εκτελούνται τοπικά στο πρόγραμμα περιήγησής σας — οι εικόνες σας δεν μεταφορτώνονται ποτέ σε διακομιστή.