Επιλογέας χρώματος
Επιλέξτε οποιοδήποτε χρώμα από μια εικόνα και δείτε άμεσα κωδικούς HEX, RGB, HSL, HSV και CMYK.
Ανεβάστε μια εικόνα για να επιλέξετε χρώμα
Σύρετε & αφήστε, επικολλήστε ή αναζητήστε — PNG, JPG, WEBP ή GIF
Συμβουλή: μπορείτε επίσης να επικολλήσετε μια εικόνα με Ctrl/Cmd + V
Κωδικοί χρωμάτων
Πλησιέστερο όνομα χρώματος: Royal Blue
Αρμονίες χρωμάτων
Έλεγχος αντίθεσης (WCAG)
Δείγμα κειμένου
Αποθηκευμένα χρώματα
Δεν υπάρχουν αποθηκευμένα χρώματα ακόμη — επιλέξτε ένα και πατήστε «Αποθήκευση χρώματος».
Ένας επιλογέας χρώματος είναι ένα εργαλείο που σας επιτρέπει να εντοπίσετε το ακριβές χρώμα ενός οποιουδήποτε εικονοστοιχείου και να το μεταφράσετε άμεσα σε κωδικούς που μπορούν να χρησιμοποιήσουν οι σχεδιαστές, οι προγραμματιστές και τα τυπογραφεία. Αντί να μαντεύετε αποχρώσεις, φορτώνετε μια εικόνα, κάνετε κλικ με το σταγονόμετρο και λαμβάνετε την τιμή του χρώματος σε πέντε διαφορετικά μοντέλα: HEX, RGB, HSL, HSV και CMYK. Είναι ιδανικό για σχεδίαση ιστοσελίδων, ανάπτυξη λογισμικού, εκτύπωση και για τη διασφάλιση της προσβασιμότητας.
Αυτός ο επιλογέας χρώματος είναι εντελώς δωρεάν και λειτουργεί απευθείας μέσα στο πρόγραμμα περιήγησής σας. Οι εικόνες σας δεν ανεβαίνουν ποτέ σε κάποιον διακομιστή — όλη η επεξεργασία γίνεται τοπικά στη συσκευή σας, οπότε τα δεδομένα σας παραμένουν ιδιωτικά. Πέρα από την απλή ανάγνωση των κωδικών HEX, RGB, HSL, HSV και CMYK, μπορείτε να εξαγάγετε ολόκληρη παλέτα από μια φωτογραφία, να δημιουργήσετε αρμονίες χρωμάτων και να ελέγξετε την αντίθεση σύμφωνα με τα πρότυπα προσβασιμότητας WCAG.
Πώς να επιλέξετε ένα χρώμα από μια εικόνα
- 1
Ανεβάστε ή σύρετε μια εικόνα
Ανεβάστε μια εικόνα από τη συσκευή σας, σύρετέ την και αφήστε την στο εργαλείο ή επικολλήστε τη με Ctrl/Cmd + V. Υποστηρίζονται αρχεία PNG, JPG, WEBP και GIF, ενώ όλη η επεξεργασία παραμένει στο πρόγραμμα περιήγησής σας.
- 2
Κάντε κλικ με το σταγονόμετρο σε ένα εικονοστοιχείο
Μετακινήστε τον δείκτη πάνω στην εικόνα και κάντε κλικ με το σταγονόμετρο στο σημείο που θέλετε. Χρησιμοποιήστε το ζουμ για μεγαλύτερη ακρίβεια, ώστε να επιλέξετε ακριβώς το εικονοστοιχείο που σας ενδιαφέρει.
- 3
Διαβάστε και αντιγράψτε τους κωδικούς
Δείτε άμεσα την τιμή του επιλεγμένου χρώματος σε HEX, RGB, HSL, HSV και CMYK. Με ένα κλικ αντιγράφετε όποιον κωδικό χρειάζεστε και τον επικολλάτε στο CSS, στο εργαλείο σχεδίασης ή στο αρχείο εκτύπωσής σας.
- 4
Εξαγάγετε μια παλέτα από την εικόνα
Πατήστε «Εξαγωγή παλέτας» για να αντλήσετε αυτόματα τα κυρίαρχα χρώματα της φωτογραφίας. Είναι ο γρηγορότερος τρόπος να χτίσετε μια συνεκτική χρωματική παλέτα με βάση μια πραγματική εικόνα.
- 5
Δημιουργήστε αρμονίες χρωμάτων
Με βάση το επιλεγμένο χρώμα, δημιουργήστε συμπληρωματικές, ανάλογες, τριαδικές, τετραδικές, διαιρεμένες συμπληρωματικές ή μονοχρωματικές αρμονίες, ώστε να συνθέσετε ισορροπημένους χρωματικούς συνδυασμούς.
- 6
Ελέγξτε την αντίθεση και αποθηκεύστε την παλέτα σας
Ελέγξτε την αντίθεση κειμένου και φόντου σύμφωνα με τα πρότυπα WCAG για να διασφαλίσετε την αναγνωσιμότητα, και στη συνέχεια αποθηκεύστε ή εξαγάγετε την παλέτα σας ως CSS, JSON ή PNG.
HEX, RGB, HSL, HSV και CMYK επεξηγούνται
Το ίδιο χρώμα μπορεί να περιγραφεί με διάφορα μοντέλα, καθένα από τα οποία εξυπηρετεί έναν διαφορετικό σκοπό. Τα HEX και RGB κυριαρχούν στον ιστό και τις οθόνες, τα HSL και HSV διευκολύνουν τη διαισθητική προσαρμογή της απόχρωσης και της φωτεινότητας, ενώ το CMYK είναι απαραίτητο για την εκτύπωση. Ο παρακάτω πίνακας δείχνει πότε να χρησιμοποιήσετε το καθένα.
| Model | Example | Best for |
|---|---|---|
| HEX | #3B82F6 | Ιστός και CSS |
| RGB | rgb(59, 130, 246) | Οθόνες και ψηφιακές εικόνες |
| HSL | hsl(217, 91%, 60%) | Διαισθητική προσαρμογή χρώματος |
| HSV | hsv(217, 76%, 96%) | Εργαλεία σχεδίασης |
| CMYK | cmyk(76%, 47%, 0%, 4%) | Εκτύπωση |
Σχεδίαση ιστού & UI
Οι σχεδιαστές διεπαφών χρησιμοποιούν τον επιλογέα χρώματος για να αντλήσουν αποχρώσεις από εικόνες αναφοράς, στιγμιότυπα οθόνης ή moodboards και να χτίσουν συνεκτικές παλέτες. Λαμβάνοντας άμεσα τιμές HEX και HSL, εξασφαλίζετε ότι κάθε κουμπί, φόντο και εικονίδιο ακολουθεί το ίδιο χρωματικό σύστημα.
Ανάπτυξη front-end
Οι προγραμματιστές αντιγράφουν κωδικούς HEX ή RGB απευθείας μέσα σε μεταβλητές CSS και design tokens. Έτσι, οι τιμές των χρωμάτων μένουν συνεπείς σε όλο τον κώδικα και οι αλλαγές θέματος γίνονται σε ένα μόνο σημείο, χωρίς σφάλματα αντιγραφής.
Εκτύπωση & branding
Για φυλλάδια, συσκευασίες και εταιρική ταυτότητα, τα χρώματα πρέπει να ορίζονται σε CMYK ώστε να αναπαράγονται σωστά στο χαρτί. Ο επιλογέας μετατρέπει άμεσα οποιοδήποτε χρώμα σε τιμές CMYK, βοηθώντας σας να διατηρήσετε συνέπεια μεταξύ οθόνης και τυπωμένου υλικού.
Προσβασιμότητα
Ο ενσωματωμένος έλεγχος αντίθεσης συγκρίνει το χρώμα του κειμένου με το φόντο και δείχνει αν πληροί τα πρότυπα WCAG (AA και AAA). Έτσι διασφαλίζετε ότι το περιεχόμενό σας είναι αναγνώσιμο για όλους τους χρήστες, συμπεριλαμβανομένων όσων έχουν μειωμένη όραση.
Η σύγκριση
Πολλοί επιλογείς χρώματος σταματούν στην απλή ανάγνωση ενός κωδικού HEX. Δείτε πώς συγκρίνεται το εργαλείο μας με το imagecolorpicker.com σε ό,τι πραγματικά χρειάζεστε.
| Μοντέλα χρώματος | HEX, RGB, HSL, HSV και CMYK | Κυρίως HEX και RGB |
| CMYK για εκτύπωση | Ναι, άμεσες τιμές CMYK | Όχι |
| Έλεγχος αντίθεσης WCAG | Ναι, με αξιολόγηση AA/AAA | Όχι |
| Αρμονίες χρωμάτων | Ναι, έξι τύποι αρμονιών | Περιορισμένες ή καθόλου |
| Διαφημίσεις | Καθόλου διαφημίσεις | Ναι, με διαφημίσεις |
Συχνές ερωτήσεις
Πώς επιλέγω ένα χρώμα από μια εικόνα;
Ανεβάστε ή σύρετε μια εικόνα στο εργαλείο και κάντε κλικ με το σταγονόμετρο στο εικονοστοιχείο του οποίου το χρώμα θέλετε. Θα δείτε αμέσως την τιμή του σε HEX, RGB, HSL, HSV και CMYK, την οποία μπορείτε να αντιγράψετε με ένα κλικ.
Τι είναι ένας κωδικός χρώματος HEX;
Ο κωδικός HEX είναι ένας δεκαεξαδικός τρόπος περιγραφής ενός χρώματος, όπως το #3B82F6. Αποτελείται από τρία ζεύγη χαρακτήρων που αντιστοιχούν στην ένταση του κόκκινου, του πράσινου και του μπλε. Είναι ο πιο συνηθισμένος τρόπος ορισμού χρωμάτων στον ιστό και στο CSS.
Πώς μετατρέπω το RGB σε HEX;
Το εργαλείο κάνει τη μετατροπή αυτόματα: μόλις επιλέξετε ή εισαγάγετε ένα χρώμα, εμφανίζονται ταυτόχρονα η τιμή RGB και η αντίστοιχη τιμή HEX. Δεν χρειάζεται να κάνετε καμία πράξη με το χέρι — απλώς αντιγράφετε τον κωδικό που χρειάζεστε.
Μπορώ να δημιουργήσω μια παλέτα από μια φωτογραφία;
Ναι. Πατώντας «Εξαγωγή παλέτας», το εργαλείο αναλύει τη φωτογραφία και εντοπίζει αυτόματα τα κυρίαρχα χρώματά της. Μπορείτε στη συνέχεια να αποθηκεύσετε ή να εξαγάγετε την παλέτα ως CSS, JSON ή PNG.
Πώς ελέγχω την αντίθεση χρωμάτων για την προσβασιμότητα;
Χρησιμοποιήστε τον ενσωματωμένο έλεγχο αντίθεσης: ορίστε το χρώμα του κειμένου και του φόντου και το εργαλείο υπολογίζει τον λόγο αντίθεσης, δείχνοντας αν πληροί τα πρότυπα WCAG για κανονικό και μεγάλο κείμενο (επίπεδα AA και AAA).
Είναι δωρεάν και ιδιωτικό;
Ναι. Ο επιλογέας χρώματος είναι εντελώς δωρεάν και δεν απαιτεί εγγραφή. Όλη η επεξεργασία γίνεται τοπικά στο πρόγραμμα περιήγησής σας — οι εικόνες σας δεν ανεβαίνουν ποτέ σε διακομιστή, οπότε τα δεδομένα σας παραμένουν πλήρως ιδιωτικά.
