Σταγονόμετρο εικόνας

Χρειάζεστε να βρείτε ποιο χρώμα έχει ένα λογότυπο, μια φωτογραφία ή ένα screenshot; Ανεβάστε την εικόνα, περάστε το ποντίκι πάνω από το σημείο που σας ενδιαφέρει και κάντε κλικ. Ο κωδικός του χρώματος αντιγράφεται αμέσως στο πρόχειρο, στη μορφή που θα επιλέξετε: HEX, RGB, HSL, HSV ή LCH. Δεν εγκαθιστάτε τίποτα και η εικόνα δεν φεύγει ποτέ από τον υπολογιστή σας.

Πώς να βρείτε το χρώμα από μια εικόνα

1. Ανεβάστε μια εικόνα. Σύρετέ την στο παράθυρο ή κάντε κλικ στο «Αναζήτηση αρχείων». Το σταγονόμετρο δέχεται JPG, PNG, WebP και GIF.
2. Επιλέξτε τη μορφή. Πάνω από την εικόνα ορίζετε σε ποια σημειογραφία θέλετε να αντιγράφεται το χρώμα («Αντιγραφή με κλικ:»). Για τον ιστό ταιριάζει συνήθως το HEX, για προγράμματα γραφικών το RGB. Το εργαλείο θυμάται την επιλογή σας.
3. Περάστε το ποντίκι πάνω από το χρώμα. Δίπλα στον κέρσορα εμφανίζεται φακός με τα γύρω pixel μεγεθυμένα και από κάτω ο κωδικός του χρώματος.
4. Κάντε κλικ. Ο κωδικός είναι στο πρόχειρο και το χρώμα αποθηκεύεται στην καρτέλα «Επιλεγμένα χρώματα». Το επικολλάτε όπου το χρειάζεστε.

Θέλετε να δοκιμάσετε άλλη εικόνα; Σύρετέ την πάνω στην τρέχουσα ή διαγράψτε την με το εικονίδιο του κάδου («Αφαίρεση εικόνας»).

Τι μπορεί να κάνει το online σταγονόμετρο

Φακός που δείχνει κάθε pixel

Ένα απλό σταγονόμετρο δείχνει μόνο το χρώμα κάτω από τον κέρσορα, οπότε το να πετύχετε την άκρη ενός λεπτού γράμματος γίνεται τυχερό παιχνίδι. Ο δικός μας φακός μεγεθύνει την περιοχή γύρω από τον κέρσορα σε 11 × 11 pixel και πλαισιώνει το κεντρικό. Βλέπετε ακριβώς πού θα κάνετε κλικ πριν κάνετε κλικ.

Ζουμ μέχρι το μεμονωμένο pixel

Με τα κουμπιά συν και πλην, ή με τη ροδέλα του ποντικιού κρατώντας πατημένο το Ctrl, μεγεθύνετε την εικόνα έως και 64 φορές. Με ενεργό το «Πλέγμα» βλέπετε τα όρια κάθε pixel, οπότε σε εικονίδια, pixel art ή μικρό κείμενο κάνετε κλικ ακριβώς εκεί που θέλετε.

Χρώμα από το πρωτότυπο, όχι από μικρογραφία

Πολλά online εργαλεία σμικρύνουν πρώτα την εικόνα και διαβάζουν το χρώμα από την προεπισκόπηση, όπου γειτονικά pixel αναμειγνύονται. Το δικό μας σταγονόμετρο δουλεύει με την εικόνα σε πλήρη ανάλυση (έως 4096 px στη μεγάλη πλευρά), οπότε παίρνετε το πραγματικό χρώμα του pixel.

Αντιγραφή με ένα κλικ

Καμία επισήμανση κειμένου, καμία μεταγραφή αριθμών. Κάθε κλικ στην εικόνα αντιγράφει τον κωδικό στη μορφή που έχετε επιλέξει. Όταν χρειάζεστε το ίδιο χρώμα και σε άλλη σημειογραφία, η λεπτομέρεια του χρώματος δείχνει και τις πέντε μορφές, καθεμία με το δικό της κουμπί αντιγραφής.

Παλέτα κυρίαρχων χρωμάτων

Μόλις ανέβει η εικόνα, το εργαλείο βρίσκει έως οκτώ χρώματα που κυριαρχούν σε αυτήν και τα δείχνει στην καρτέλα «Κυρίαρχα χρώματα». Σχεδόν ίδιες αποχρώσεις συγχωνεύονται, οπότε στην παλέτα δεν θα βρείτε πέντε παραλλαγές του γκρι, και οι διάφανες περιοχές ενός PNG αγνοούνται. Η παλέτα είναι καλή αφετηρία για το χρωματικό σχήμα ενός ιστότοπου, μιας παρουσίασης ή αναρτήσεων στα social media. Αν θέλετε να δείτε αν οι αποχρώσεις κρατούν αρκετή αντίθεση και χωρίς χρώμα, το ελέγχετε γρήγορα με τη μετατροπή της εικόνας σε κλίμακα του γκρι.

Επιλεγμένα χρώματα πάντα διαθέσιμα

Κάθε χρώμα στο οποίο κάνετε κλικ αποθηκεύεται στην καρτέλα «Επιλεγμένα χρώματα» (τα τελευταία 24). Έτσι μπορείτε να συγκρίνετε πολλά σημεία της εικόνας και να επιστρέψετε σε αυτά όποτε θέλετε. Σε μεγάλη οθόνη το πλαίσιο με τα χρώματα βρίσκεται αμέσως δίπλα στην εικόνα.

Πού χρειάζεστε τον κωδικό χρώματος από μια εικόνα

• Ιστότοποι και εφαρμογές: Ο πελάτης σάς έστειλε το λογότυπο μόνο σε JPG και χρειάζεστε το ακριβές χρώμα της μάρκας για το CSS. Αν θέλετε και έκδοση με διάφανο φόντο, χρησιμοποιήστε την αφαίρεση φόντου από εικόνα.
• Γραφικά και social media: Θέλετε το κείμενο μιας ανάρτησης να ταιριάζει με τη φωτογραφία. Πάρτε το χρώμα κατευθείαν από αυτήν.
• Παρουσιάσεις και έγγραφα: Ορίζετε τα χρώματα του εταιρικού λογότυπου στο PowerPoint, στο Google Slides ή στο Canva μέσω HEX ή RGB.
• Έλεγχος σχεδίασης: Σε ένα screenshot επιβεβαιώνετε αν ένα κουμπί της εφαρμογής έχει όντως το χρώμα που ορίζει το design. Το μέγεθος των εξαγόμενων αρχείων το ελέγχετε στη συνέχεια με την ανάλυση διαστάσεων εικόνων.
• Εσωτερικός χώρος και μόδα: Έχετε φωτογραφία υφάσματος ή τοίχου και ψάχνετε παρόμοια απόχρωση. Ο κωδικός είναι καλή αφετηρία όταν ψάχνετε σε δειγματολόγιο.

Μορφές χρωμάτων που δίνει το σταγονόμετρο

• HEX (#1373b6): η σημειογραφία για HTML, CSS και τα περισσότερα εργαλεία γραφικών.
• RGB (rgb(19, 115, 182)): το ποσοστό κόκκινου, πράσινου και μπλε, καθένα από 0 έως 255. Πώς λειτουργεί η προσθετική ανάμειξη χρωμάτων περιγράφει η Wikipedia.
• HSL (hsl(205, 81%, 39%)): απόχρωση, κορεσμός και φωτεινότητα. Εύκολα φτιάχνετε από αυτό μια πιο ανοιχτή ή πιο σκούρα παραλλαγή.
• HSV: απόχρωση, κορεσμός και τιμή, όπως τα ξέρετε από την επιλογή χρώματος στο Photoshop ή στο GIMP. Τη διαφορά ανάμεσα σε HSL και HSV εξηγεί αναλυτικά η Wikipedia (αγγλικά).
• LCH: μοντέλο που αντιστοιχεί στον τρόπο που το ανθρώπινο μάτι αντιλαμβάνεται τα χρώματα. Αντιγράφεται στη σημειογραφία που καταλαβαίνει το σύγχρονο CSS (δείτε το MDN, αγγλικά).

Το σταγονόμετρο βρίσκει το χρώμα μιας εικόνας. Αν θέλετε να το επεξεργαστείτε περαιτέρω, να το μετατρέψετε σε άλλες μορφές ή να βρείτε αποχρώσεις που ταιριάζουν μαζί του, συνεχίστε στον χρωματικό τροχό.

Συχνές ερωτήσεις

Ανεβαίνει η εικόνα μου σε κάποιον server;

Όχι. Η εικόνα φορτώνεται και επεξεργάζεται απευθείας στον browser σας, δεν αποστέλλεται πουθενά και μετά το κλείσιμο της σελίδας δεν μένει τίποτα. Το σταγονόμετρο μπορείτε να το χρησιμοποιήσετε άφοβα ακόμα και για εσωτερικό υλικό ή σχέδια που δεν έχουν δημοσιευτεί.

Πώς βρίσκω τον κωδικό HEX ενός χρώματος από μια φωτογραφία;

Ανεβάστε τη φωτογραφία, αφήστε επιλεγμένη τη μορφή HEX πάνω από την εικόνα και κάντε κλικ στο σημείο με το χρώμα που ψάχνετε. Ο κωδικός, για παράδειγμα #75dab2, είναι αμέσως στο πρόχειρο.

Γιατί το χρώμα από τη φωτογραφία διαφέρει από την πραγματικότητα;

Η φωτογραφική μηχανή επηρεάζει τα χρώματα μέσω του φωτισμού, της ισορροπίας χρώματος και της συμπίεσης. Το σταγονόμετρο επιστρέφει ακριβώς το χρώμα που είναι αποθηκευμένο στο αρχείο. Σε φωτογραφίες, λοιπόν, κάντε κλικ σε λίγα διαφορετικά σημεία και συγκρίνετέ τα στην καρτέλα «Επιλεγμένα χρώματα». Αν φτιάχνετε βαφή τοίχου με βάση τον κωδικό, θεωρήστε τον ενδεικτικό.

Λειτουργεί το σταγονόμετρο σε κινητό;

Ναι. Σε οθόνη αφής πατάτε το σημείο στην εικόνα και ο κωδικός αντιγράφεται όπως στον υπολογιστή. Ο φακός δίπλα στον κέρσορα δεν εμφανίζεται σε κινητό, γι' αυτό σε μικρές λεπτομέρειες μεγεθύνετε πρώτα την εικόνα.

Ποια είναι η διαφορά ανάμεσα σε HEX και RGB;

Και οι δύο σημειογραφίες περιγράφουν το ίδιο χρώμα. Το RGB το εκφράζει με τρεις αριθμούς από 0 έως 255, το HEX γράφει τους ίδιους αριθμούς σε δεκαεξαδικό σύστημα μετά το σύμβολο #. Για παράδειγμα, το rgb(255, 87, 51) είναι το ίδιο με το #ff5733.

Πώς παίρνω ολόκληρη τη χρωματική παλέτα από μια εικόνα;

Ανοίξτε την καρτέλα «Κυρίαρχα χρώματα». Θα βρείτε έως οκτώ κύρια χρώματα της εικόνας και με κλικ σε οποιοδήποτε από αυτά αντιγράφετε τον κωδικό του.