Γεννήτρια CSS Gradient

Τι σας βοηθά να κάνετε αυτό το εργαλείο

Δημιουργήστε μια αναπαραγώγιμη χρωματική κλίμακα, προεπισκοπήστε κάθε παραγόμενο βήμα και αντιγράψτε την ακριβή ακολουθία HEX για CSS, γραφήματα ή design tokens.

Παράδειγμα εφαρμογής

Πώς παράγεται το αποτέλεσμα

Κάθε ενδιάμεσο χρώμα δημιουργείται με γραμμική παρεμβολή των καναλιών κόκκινου, πράσινου και μπλε. Τα άκρα διατηρούνται και τα υπόλοιπα χρώματα τοποθετούνται σε ίσα διαστήματα.

Χρήσιμες ροές εργασίας

• Δημιουργήστε διατεταγμένα χρώματα γραφημάτων ή κλίμακες θερμότητας
• Δημιουργήστε χρώματα hover και κατάστασης μεταξύ δύο design tokens
• Παράγετε μια συμπαγή παλέτα για ένα gradient φόντου

Σημαντικοί περιορισμοί

• Η παρεμβολή RGB μπορεί να φαίνεται πιο σκούρα ή λασπωμένη μεταξύ ορισμένων συμπληρωματικών χρωμάτων.
• Μια ομαλή παλέτα δεν είναι αυτόματα προσβάσιμη για άτομα με αχρωματοψία.
• Αυτή η γεννήτρια παράγει ομοιόμορφα κατανεμημένα χρώματα RGB· δεν ισχυρίζεται αντιληπτική ομοιομορφία.

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

Γιατί το μεσαίο σημείο μπορεί να φαίνεται γκρι ή λασπωμένο;

Τα αντίθετα κανάλια RGB μπορεί να εξισορροπούνται προς ένα ουδέτερο χρώμα. Πρόσθεσε ένα κατάλληλο μεσαίο χρώμα σε μια ροή εργασίας CSS πολλαπλών στάσεων όταν η οπτική ζωντάνια έχει σημασία.

Πόσα χρώματα πρέπει να δημιουργήσω;

Χρησιμοποίησε τον μικρότερο αριθμό που ταιριάζει με τις διακριτές καταστάσεις ή ζώνες δεδομένων που χρειάζεσαι· τα συνεχή φόντα μπορούν να χρησιμοποιήσουν περισσότερα βήματα.