Μετατροπέας RGB σε HSL
Μετατρέψτε τιμές κόκκινου, πράσινου και μπλε σε απόχρωση, κορεσμό και φωτεινότητα για ευκολότερη ρύθμιση χρωμάτων στη CSS.
Εισαγωγή rgb
Αποτέλεσμα · HSL
hsl(344, 100%, 62%)
HEX
#FF3D72
RGB
rgb(255, 61, 114)
HSV
hsv(344, 76%, 100%)
CMYK
cmyk(0%, 76%, 55%, 0%)
Τρόπος χρήσης: RGB σε HSL
- 1
Εισαγάγετε ένα χρώμα
Πληκτρολογήστε έναν κωδικό χρώματος ή επιλέξτε χρώμα με τον επιλογέα — κάθε πεδίο δέχεται τη μορφή που εμφανίζει.
- 2
Δείτε τη μετατροπή
Το αποτέλεσμα ενημερώνεται αμέσως καθώς πληκτρολογείτε, μαζί με ζωντανή προεπισκόπηση του χρώματος.
- 3
Αντιγράψτε τον κωδικό
Αντιγράψτε την τιμή που χρειάζεστε με ένα κλικ και επικολλήστε την στο σχέδιό σας, στο CSS ή στις ρυθμίσεις εκτύπωσης.
RGB ή HSL
Το RGB συνθέτει ένα χρώμα από τρία κανάλια φωτός, κάτι που ταιριάζει στις οθόνες αλλά είναι δύσκολο να ρυθμιστεί με το χέρι: για να γίνει το rgb(255, 61, 114) λίγο πιο σκούρο, πρέπει να αλλάξουν και οι τρεις αριθμοί. Το HSL περιγράφει το ίδιο χρώμα ως απόχρωση, μια γωνία στον χρωματικό τροχό από 0 έως 360°, συν κορεσμό και φωτεινότητα σε ποσοστό, οπότε αυτό το ροζ γίνεται hsl(344, 100%, 62%).
Αυτή η δομή κάνει το HSL ιδανικό για τη δημιουργία αποχρώσεων και θεμάτων. Κρατήστε την απόχρωση και τον κορεσμό και χαμηλώστε τη φωτεινότητα για κατάσταση hover ή πατήματος, αυξήστε τη για ένα χρωματισμένο φόντο ή μειώστε τον κορεσμό για μια πιο συγκρατημένη εκδοχή. Όλα τα σύγχρονα προγράμματα περιήγησης δέχονται το hsl() στη CSS, οπότε μπορείτε να επικολλήσετε απευθείας το αποτέλεσμα. Ο μετατροπέας στρογγυλοποιεί τις τιμές σε ακέραιους, οπότε η αντίστροφη μετατροπή μπορεί να μετακινήσει ένα κανάλι κατά ένα βήμα.
Όλα εκτελούνται τοπικά στο πρόγραμμα περιήγησής σας — οι εικόνες σας δεν μεταφορτώνονται ποτέ σε διακομιστή.