Εργαλεία χρωμάτων

Δωρεάν online εργαλεία χρωμάτων — επιλογέας χρώματος, γεννήτρια παλέτας, μετατροπέας μορφής, προσομοιωτής τύφλωσης χρωμάτων, γεννήτρια κλίσης, έλεγχος αντίθεσης WCAG, εξαγωγέας κυρίαρχου χρώματος, μείκτης, θερμοκρασία χρώματος, κινεζικά παραδοσιακά χρώματα. Όλα μέσα στον περιηγητή.
Για συγγραφή HTML/CSS (ισοδύναμα hex/rgb/hsl, 148 ονομαστικά χρώματα, παλέτα 216 χρωμάτων ασφαλών για τον ιστό, δηλώσεις έτοιμες για αντιγραφή) χρησιμοποιείται το εργαλείο Κωδικοί χρωμάτων HTML.
HEX:#ff0000
RGB:255, 0, 0
HSL:0, 100%, 50%
Πώς λειτουργεί κάθε λειτουργία
Επιλογέας: Το μεγάλο τετράγωνο είναι χάρτης κορεσμού-φωτεινότητας στην τρέχουσα απόχρωση — από αριστερά προς τα δεξιά αυξάνεται ο κορεσμός, από πάνω προς τα κάτω μειώνεται η φωτεινότητα. Κλικ οπουδήποτε πάνω του για επιλογή χρώματος. Η λεπτή κατακόρυφη μπάρα δεξιά είναι το ρυθμιστικό απόχρωσης (0° έως 360°) — μετακίνηση για αλλαγή της βασικής απόχρωσης και το τετράγωνο σχεδιάζεται ξανά αντίστοιχα. Η δεξιά πλευρά δείχνει το επιλεγμένο χρώμα σε μορφές HEX, RGB και HSL — κλικ σε οποιαδήποτε τιμή για αντιγραφή.
Παλέτα: Ο αριστερός επιλογέας χρώματος και το δεξί πλαίσιο επεξεργασίας αποθηκεύουν το ίδιο βασικό χρώμα — είναι συγχρονισμένα αμφίδρομα (επιλογή χρώματος ή πληκτρολόγηση τιμής hex, και τα δύο ενημερώνονται αμοιβαία). Οι πέντε σειρές παλέτας παρακάτω προέρχονται όλες από αυτό το βασικό χρώμα με περιστροφή της απόχρωσής του στον τροχό χρωμάτων: Συμπληρωματικό (απόχρωση +180°, μέγιστη αντίθεση), Τριαδικό (+120° / +240°, ισορροπημένη τριάδα), Τετραδικό (+90° / +180° / +270°, ορθογώνιο τετράχρωμο), Ανάλογο (-30° / βάση / +30° / +60°, αρμονικοί γείτονες) και Διαιρεμένο συμπληρωματικό (+150° / +210°, πιο ήπιο από το καθαρό συμπληρωματικό). Το πρώτο δείγμα κάθε σειράς είναι πάντα το ίδιο το βασικό χρώμα, και τα υπόλοιπα είναι οι παραλλαγές του με περιστροφή της απόχρωσης.
Μετατροπή: Εισαγωγή οποιουδήποτε έγκυρου χρώματος — HEX (#3b82f6), συνάρτηση CSS (rgb(59,130,246) / hsl(217,90%,60%)) ή ονομαστικό χρώμα (dodgerblue) — και άμεση μετατροπή σε όλες τις βασικές μορφές. Το αναπτυσσόμενο μενού μορφής μπορεί προαιρετικά να υποδείξει τον αναλυτή, αν η αυτόματη ανίχνευση επιλέξει λάθος μορφή. Η έξοδος δείχνει HEX, RGB (0-255), HSL (μοίρες, %, %), HSV και CMYK. Κλικ σε οποιαδήποτε τιμή για αντιγραφή.
Τύφλωση: Μεταφόρτωση εικόνας και επιλογή τύπου έλλειψης όρασης χρωμάτων για προσομοίωση. Το εργαλείο εφαρμόζει μετασχηματισμό πίνακα απόκρισης κωνίων σε κάθε εικονοστοιχείο, αναχαρτογραφώντας τις τιμές RGB ώστε να προσεγγίζει πώς αντιλαμβάνονται την εικόνα άνθρωποι με διαφορετικές μορφές τύφλωσης χρωμάτων. Ο αριστερός καμβάς δείχνει το αρχικό, ο δεξιός την προσομοιωμένη όψη. Το αναπτυσσόμενο μενού καλύπτει τρεις τύπους διχρωματοψίας (απουσία μιας χρωστικής κώνου: πρωτανοπία, δευτερανοπία, τριτανοπία), την πλήρη ακρομονοπία (χωρίς όραση χρωμάτων) και τρεις τύπους ανώμαλης τριχρωμίας (αδύναμη απόκριση κώνων). Οι εικόνες χαμηλότερης ανάλυσης φορτώνουν ταχύτερα.
Κλίση: Πρόκειται για οπτικό δημιουργό κλίσεων CSS. Επιλογή γραμμικής (κατευθυντικής) ή ακτινικής (από το κέντρο προς τα έξω) κλίσης, ρύθμιση της γωνίας (0° = από κάτω προς τα πάνω, 90° = από αριστερά προς τα δεξιά) και ορισμός σημείων χρώματος. Κάθε σημείο έχει επιλογέα χρώματος και είναι ισαπέχον (0%, 50%, 100% για τρία σημεία). Το + Σημείο προσθέτει ενδιάμεσα σημεία χρώματος για πιο σύνθετες κλίσεις. Η προεπισκόπηση ενημερώνεται ζωντανά, και ο παραγόμενος κώδικας CSS είναι έτοιμος για αντιγραφή παρακάτω.
Αντίθεση: Υπολογίζει τον λόγο αντίθεσης WCAG 2.1 μεταξύ κειμένου προσκηνίου και χρώματος φόντου, με τον τύπο της σχετικής φωτεινότητας από τιμές sRGB (με διόρθωση γάμμα). Ο λόγος κυμαίνεται από 1:1 (ταυτόσημα χρώματα) έως 21:1 (μαύρο έναντι λευκού). Τα αποτελέσματα δείχνουν επιτυχία/αποτυχία σε τρία επίπεδα συμμόρφωσης: AA Κανονικό κείμενο (λόγος ≥ 4,5:1), AAA Μεγάλο κείμενο (λόγος ≥ 4,5:1 για κείμενο ≥ 18pt ή έντονο ≥ 14pt) και AAA Κανονικό κείμενο (λόγος ≥ 7:1). Η προεπισκόπηση δείγματος κειμένου ενημερώνεται σε πραγματικό χρόνο καθώς αλλάζουν τα χρώματα.
Εξαγωγή: Μεταφόρτωση οποιασδήποτε εικόνας και το εργαλείο εντοπίζει την παλέτα κυρίαρχων χρωμάτων της με κβαντοποίηση χρωμάτων. Η εικόνα υποδειγματίζεται σε 100×100 px, και στη συνέχεια κάθε εικονοστοιχείο κατατάσσεται σε ιστόγραμμα 4 bit ανά κανάλι (16 επίπεδα ανά R/G/B = 4096 κάδοι). Τα διαφανή εικονοστοιχεία παραλείπονται. Οι συχνότεροι κάδοι ταξινομούνται κατά πλήθος εικονοστοιχείων, και το κεντρικό χρώμα κάθε κάδου γίνεται δείγμα. Κάθε δείγμα δείχνει την τιμή HEX του και το ποσοστό των εικονοστοιχείων της εικόνας που αντιπροσωπεύει. Η ρύθμιση του πλήθους (2-12) ελέγχει πόσα κυρίαρχα χρώματα εξάγονται.
Μείκτης: Αναμειγνύει δύο χρώματα στον χρωματικό χώρο RGB με γραμμική παρεμβολή. Ο ρυθμός καθορίζει το μείγμα: το 0% είναι καθαρό Χρώμα 1, το 100% καθαρό Χρώμα 2 και το 50% ισομερές μείγμα. Κάθε κανάλι R, G, B παρεμβάλλεται ανεξάρτητα (π.χ. κόκκινο + μπλε στο 50% δίνει μωβ). Η προεπισκόπηση αποτελέσματος και οι τιμές HEX/RGB ενημερώνονται ζωντανά κατά τη μετακίνηση του ρυθμιστικού ή την αλλαγή οποιουδήποτε χρώματος.
Θερμοκρασία: Μετατρέπει τη θερμοκρασία χρώματος μέλανος σώματος σε Kelvin στο αντίστοιχο ορατό χρώμα με τον αλγόριθμο προσέγγισης του Tanner Helland. Οι χαμηλές θερμοκρασίες (1000-3000K) παράγουν θερμούς πορτοκαλί/κόκκινους τόνους όπως το φως κεριού και οι λάμπες πυράκτωσης· οι ενδιάμεσες (4000-6500K) δίνουν ουδέτερο λευκό έως φως ημέρας· οι υψηλότερες (8000-40000K) μετατοπίζονται σε ψυχρό μπλε, όπως ο ουρανός με συννεφιά και τα βαθιά νερά. Η ετικέτα παρακάτω προσδιορίζει την πλησιέστερη πραγματική πηγή φωτός για κάθε θερμοκρασία.
Ονομαστικά: Περιήγηση σε ενιαία συλλογή 80 κινεζικών παραδοσιακών χρωμάτων (胭脂, 朱砂, 黛蓝 κ.ά. — ονόματα από την κλασική κινεζική λογοτεχνία, ζωγραφική και παραδόσεις βαφής) και πάνω από 140 ονομαστικών χρωμάτων CSS (η τυπική παλέτα του ιστού). Η αναζήτηση φιλτράρει κατά όνομα ή τιμή HEX, ή η αλλαγή κατηγορίας γίνεται με το αναπτυσσόμενο μενού. Κλικ σε οποιοδήποτε χρωματικό δείγμα εμφανίζει μεγάλη προεπισκόπηση με το όνομα και τον κωδικό HEX — κλικ στον κωδικό για αντιγραφή.