Μετατροπέας HSL σε RGBA
Μετατρέψτε απόχρωση, κορεσμό και φωτεινότητα σε τιμή rgba() έτοιμη για διαφάνεια στη CSS.
Εισαγωγή hsl
Αποτέλεσμα · RGBA
rgba(255, 61, 119, 1)
HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Τρόπος χρήσης: HSL σε RGBA
- 1
Εισαγάγετε ένα χρώμα
Πληκτρολογήστε έναν κωδικό χρώματος ή επιλέξτε χρώμα με τον επιλογέα — κάθε πεδίο δέχεται τη μορφή που εμφανίζει.
- 2
Δείτε τη μετατροπή
Το αποτέλεσμα ενημερώνεται αμέσως καθώς πληκτρολογείτε, μαζί με ζωντανή προεπισκόπηση του χρώματος.
- 3
Αντιγράψτε τον κωδικό
Αντιγράψτε την τιμή που χρειάζεστε με ένα κλικ και επικολλήστε την στο σχέδιό σας, στο CSS ή στις ρυθμίσεις εκτύπωσης.
Σχετικά με τα HSL και RGBA
Τα HSL και RGBA προέρχονται από δύο διαφορετικούς τρόπους σκέψης για το χρώμα. Το HSL ορίζει ένα χρώμα με απόχρωση, κορεσμό και φωτεινότητα, κάτι που διευκολύνει τη σχεδίαση ενός συνόλου συγγενικών αποχρώσεων. Το RGBA το ορίζει με τιμές καναλιών κόκκινου, πράσινου και μπλε από 0 έως 255 συν ένα κανάλι άλφα για την αδιαφάνεια — τη μορφή που περιμένουν πολλές βιβλιοθήκες JavaScript, ο κώδικας σχεδίασης σε canvas, τα εργαλεία γραφημάτων και παλαιότερες βάσεις κώδικα CSS.
Ο μετατροπέας μετατρέπει τις τιμές HSL σε rgba() με άλφα 1, δηλαδή πλήρως αδιαφανές. Αλλάξτε αυτόν τον τελευταίο αριθμό για διαφάνεια: 0.8 για ένα ελαφρώς διάφανο πάνελ, 0.3 για επικάλυψη σε φωτογραφία, 0 για αόρατο. Συμβουλή: στη σύγχρονη CSS μπορείτε επίσης να προσθέσετε άλφα απευθείας στο HSL, όπως στο hsl(160 60% 45% / 0.3), αλλά το rgba() είναι ασφαλέστερη επιλογή όταν μια βιβλιοθήκη ή ένα πρότυπο email δεν υποστηρίζει τη νεότερη σύνταξη.
Όλα εκτελούνται τοπικά στο πρόγραμμα περιήγησής σας — οι εικόνες σας δεν μεταφορτώνονται ποτέ σε διακομιστή.