Ο κανόνας 60-30-10
Αυτός είναι ο πιο χρήσιμος κανόνας για να μοιράσεις τα χρώματα. Προέρχεται από τη διακόσμηση εσωτερικών χώρων, αλλά λειτουργεί σε κάθε έργο.
- 60 %: το κυρίαρχο χρώμα. Συνήθως ουδέτερο ή απαλό. Καλύπτει το φόντο και τις μεγάλες επιφάνειες.
- 30 %: το δευτερεύον χρώμα. Δίνει προσωπικότητα. Βάλ' το σε ενότητες, μενού ή έπιπλα.
- 10 %: το χρώμα έμφασης. Το πιο έντονο. Βάλ' το σε κουμπιά, εικονίδια ή λεπτομέρειες.
Για παράδειγμα: σπασμένο λευκό στο 60 %, μπλε μαρέν στο 30 % και πορτοκαλί στο 10 %.
Δεν χρειάζεται να μετράς με ακρίβεια. Η ουσία είναι ότι ένα χρώμα οδηγεί, ένα στηρίζει και ένα ξεχωρίζει.
Ο ρόλος των ουδέτερων χρωμάτων
Ουδέτερα χρώματα είναι το λευκό, το μαύρο, το γκρι, το μπεζ, το κρεμ και τα ανοιχτά καφέ. Ταιριάζουν σχεδόν με όλα.
Ξεκουράζουν το μάτι και αφήνουν τα έντονα χρώματα να ξεχωρίσουν καλύτερα. Μια παλέτα χωρίς ουδέτερα συνήθως κουράζει.
- Λευκό και σπασμένο λευκό: καθαρότητα και χώρος.
- Γκρι: μοντέρνο και συγκρατημένο. Διάλεξε ζεστά ή ψυχρά γκρι που ταιριάζουν με την υπόλοιπη παλέτα.
- Μπεζ και αμμουδί: ζεστασιά και φυσικότητα.
- Μαύρο ή σχεδόν μαύρο: κομψότητα και αντίθεση. Για κείμενο, ένα πολύ σκούρο γκρι είναι συνήθως πιο ξεκούραστο από το καθαρό μαύρο.
Συνδυασμοί με βάση τη θερμοκρασία
Τα χρώματα είναι ζεστά (κόκκινο, πορτοκαλί, κίτρινο) ή ψυχρά (μπλε, πράσινο, μοβ). Μπορείς να τα συνδυάσεις με τρεις απλούς τρόπους:
- Μόνο ζεστά χρώματα: φιλόξενα και ενεργητικά. Ιδανικά για εστιατόρια ή φιλικές μάρκες.
- Μόνο ψυχρά χρώματα: ήρεμα και επαγγελματικά. Ιδανικά για υγεία, τεχνολογία ή οικονομικά.
- Ψυχρή βάση με ζεστό χρώμα έμφασης: η πιο ευέλικτη επιλογή. Η ζεστή έμφαση τραβά το βλέμμα πάνω σε ένα ήρεμο φόντο.
Τι συνήθως δεν λειτουργεί: πολλά έντονα ζεστά και ψυχρά χρώματα μαζί, χωρίς κυρίαρχο χρώμα.
Αντίθεση για το κείμενο
Ένα ωραίο χρώμα δεν χρησιμεύει σε τίποτα αν το κείμενο δεν διαβάζεται. Η αντίθεση ανάμεσα σε κείμενο και φόντο είναι βασική για την αναγνωσιμότητα και την προσβασιμότητα.
- Βάλε σκούρο κείμενο σε ανοιχτό φόντο ή ανοιχτό κείμενο σε σκούρο φόντο.
- Απόφυγε κίτρινο, ανοιχτό πράσινο ή ανοιχτό γκρι κείμενο πάνω σε λευκό.
- Μη βάζεις κορεσμένα συμπληρωματικά χρώματα το ένα πάνω στο άλλο, όπως κόκκινο σε πράσινο. «Τρεμοπαίζει» και κουράζει τα μάτια.
- Οι κανόνες WCAG ζητούν λόγο αντίθεσης τουλάχιστον 4,5:1 για κανονικό κείμενο και 3:1 για μεγάλο κείμενο.
Μπορείς να ελέγξεις οποιοδήποτε ζευγάρι χρωμάτων στον έλεγχο αντίθεσης μας.
15 συνδυασμοί χρωμάτων που πάντα πετυχαίνουν
Αυτά τα ζευγάρια είναι μια ασφαλής αφετηρία. Χρησιμοποίησέ τα ως βάση και πρόσθεσε ένα ουδέτερο ή ένα χρώμα έμφασης αν χρειάζεται.
- Μπλε μαρέν και κρεμ: κλασικός, σοβαρός και ευανάγνωστος.
- Μαύρο και χρυσό: πολυτέλεια και κομψότητα.
- Μπλε και πορτοκαλί: συμπληρωματικός και γεμάτος ενέργεια.
- Πράσινο του πεύκου και μπεζ: φυσικός και ήρεμος.
- Ροζ και ανθρακί: μοντέρνος και ισορροπημένος.
- Κίτρινο και μαύρο: μέγιστη αντίθεση, ιδανικός για προειδοποιήσεις.
- Μπορντό και αμμουδί: ζεστός και εκλεπτυσμένος.
- Τιρκουάζ και κοραλλί: φρέσκος και καλοκαιρινός.
- Μοβ και ανοιχτό λιλά: μονοχρωματικός και δημιουργικός.
- Καφέ και πράσινο φασκόμηλου: γήινος, ιδανικός για μάρκες με φυσικό χαρακτήρα.
- Γκρι και ροδακινί: απαλός και φιλικός.
- Μπλε πετρόλ και ανοιχτό κίτρινο: ήρεμος με μια πινελιά φωτός.
- Τερακότα και σπασμένο λευκό: ζεστός και μεσογειακός.
- Σκούρο πετρόλ και μουσταρδί: ρετρό και με χαρακτήρα.
- Λευκό και κόκκινο: άμεσος, ενεργητικός και ευδιάκριτος.
Πολύ περισσότερες ιδέες με κωδικούς HEX θα βρεις στη σελίδα μας συνδυασμοί χρωμάτων.
Ποια χρώματα ταιριάζουν με κάθε χρώμα
Αν έχεις ήδη ένα κύριο χρώμα, αυτή η λίστα σού δίνει μια γρήγορη αφετηρία:
- Κόκκινο: λευκό, μαύρο, γκρι, μπλε μαρέν και μπεζ. Για κάτι πιο τολμηρό: ροζ ή πορτοκαλί.
- Πορτοκαλί: μπλε μαρέν, τιρκουάζ, λευκό, κρεμ και καφέ.
- Κίτρινο: γκρι, μαύρο, μπλε μαρέν και λευκό. Το μουσταρδί ταιριάζει ωραία με σκούρο πράσινο.
- Πράσινο: μπεζ, λευκό, καφέ, χρυσό και απαλό ροζ.
- Μπλε: λευκό, πορτοκαλί, γκρι, κίτρινο και κοραλλί. Το μπλε μαρέν λειτουργεί σχεδόν σαν ουδέτερο.
- Μοβ: γκρι, λιλά, χρυσό, πράσινο φασκόμηλου και λευκό.
- Ροζ: γκρι, μπλε μαρέν, λαδί, λευκό και χρυσό.
- Καφέ: κρεμ, πράσινο, μπλε πετρόλ, πορτοκαλί και σπασμένο λευκό.
Σίγουρα πρόσεξες ότι τα ουδέτερα υπάρχουν σχεδόν σε κάθε λίστα. Είναι ο πιο ασφαλής σύντροφος για ένα έντονο χρώμα.
Πώς φτιάχνεις τον δικό σου συνδυασμό
- Διάλεξε ένα κύριο χρώμα ανάλογα με αυτό που θέλεις να εκφράσεις.
- Βρες στον χρωματικό κύκλο ένα δευτερεύον χρώμα: διπλανό για κάτι ήρεμο, απέναντι για κάτι έντονο.
- Πρόσθεσε ένα ή δύο ουδέτερα χρώματα.
- Διάλεξε ένα χρώμα έμφασης για το πιο σημαντικό στοιχείο.
- Δοκίμασε την παλέτα σε ένα πραγματικό παράδειγμα: μια ιστοσελίδα, μια διαφάνεια παρουσίασης ή μια φωτογραφία δωματίου.
Όταν διστάζεις, χρησιμοποίησε λιγότερα χρώματα. Τρία έως πέντε χρώματα αρκούν σχεδόν για κάθε έργο.
Συχνά λάθη με τα χρώματα
- Πάρα πολλά χρώματα. Το αποτέλεσμα δείχνει φορτωμένο και τίποτα δεν ξεχωρίζει.
- Ίδιο βάρος σε όλα τα χρώματα. Χωρίς κυρίαρχο χρώμα το μάτι δεν ξέρει πού να κοιτάξει.
- Ξεχασμένη αντίθεση. Κείμενο που δεν διαβάζεται ή κουμπιά που δεν τα βλέπει κανείς.
- Όλα υπερκορεσμένα. Τα πολύ έντονα χρώματα κουράζουν. Συνδύασέ τα με πιο απαλές αποχρώσεις.
- Αγνόηση του πλαισίου. Ένα χρώμα δείχνει διαφορετικό στο φως της μέρας, στην οθόνη και στο χαρτί.
- Αντιγραφή χωρίς προσαρμογή. Μια παλέτα που λειτουργεί για μια μάρκα μπορεί να μην ταιριάζει στο δικό σου κοινό.
- Ανάμειξη ουδέτερων με διαφορετική θερμοκρασία. Ένα ψυχρό γκρι δίπλα σε ένα ζεστό μπεζ μπορεί να δείχνει βρόμικο. Διάλεγε ουδέτερα από την ίδια οικογένεια.
- Καμία δοκιμή σε άλλες οθόνες. Ένα χρώμα μπορεί να είναι υπέροχο στον υπολογιστή και θαμπό στο κινητό. Έλεγχέ το πάντα σε περισσότερες από μία συσκευές.