Κινούμενη Διαβάθμιση
Δημιουργήστε κινούμενα φόντα διαβάθμισης με CSS. Χρησιμοποιήστε το Κινούμενη Διαβάθμιση δωρεάν online, χωρίς εγγραφή, με γρήγορα αποτελέσματα και ασφαλή επεξεργασία στον browser.
Προεπισκόπηση
Ρυθμίσεις
Κώδικας CSS
@keyframes gradient-shift {
0% { background-position: 0% 50%; }
50% { background-position: 100% 50%; }
100% { background-position: 0% 50%; }
}
.animated-gradient {
linear-gradient(-45deg, #667eea, #764ba2, #f093fb);
animation: gradient-shift 5s ease infinite;
background-size: 400% 400%;
}Το Κινούμενη Διαβάθμιση σας βοηθά να δουλεύετε με χρώματα απευθείας στον browser.
Το εργαλείο έχει σχεδιαστεί για designers, developers και δημιουργούς που χρειάζονται γρήγορα και αξιόπιστα αποτελέσματα.
Supported formats
How it works
Step 1
Ανοίξτε το Κινούμενη Διαβάθμιση
Step 2
Εισαγάγετε ή εισάγετε τα χρώματά σας
Step 3
Αντιγράψτε, εξάγετε ή επαναχρησιμοποιήστε το αποτέλεσμα
Συνηθισμένα λάθη προς αποφυγή
- Η παράλειψη ελέγχου αντίθεσης μπορεί να βλάψει την αναγνωσιμότητα.
- Τα πολλά χρώματα κάνουν μια παλέτα δυσκολότερη στη χρήση.
Συμβουλές από ειδικούς (Pro tips)
- Κρατήστε τα βασικά χρώματα ως CSS variables.
- Δοκιμάστε την παλέτα σε light και dark mode πριν τη δημοσίευση.
Privacy guaranteed: everything is processed locally in your browser.
Όποτε είναι δυνατό, η επεξεργασία γίνεται τοπικά στον browser. Δεν απαιτείται λογαριασμός.
Κινούμενη Διαβάθμιση για τα χρωματικά σας έργα
Δημιουργήστε κινούμενα φόντα διαβάθμισης με CSS.
Κινούμενη Διαβάθμιση χωρίς απώλεια ακρίβειας
Οι μετατροπές βασίζονται σε ακριβείς τιμές (HEX, RGB, HSL, OKLCH). Χωρίς οπτική προσέγγιση — λαμβάνετε το χρώμα πιστό στην πρόθεση του design.
Κινούμενη Διαβάθμιση δωρεάν online
Χωρίς εγγραφή, χωρίς λήψη λογισμικού. Το Κινούμενη Διαβάθμιση είναι 100% δωρεάν και λειτουργεί σε κάθε browser. Το δωρεάν πλάνο περιλαμβάνει 10 χρήσεις την ημέρα.
Κινούμενη Διαβάθμιση γρήγορα και με ασφάλεια
Η επεξεργασία γίνεται απευθείας στον browser για μέγιστη ταχύτητα. Κανένα δεδομένο δεν στέλνεται στους servers — τα χρώματά σας παραμένουν ιδιωτικά.
Κινούμενη Διαβάθμιση για κοινή χρήση και συνεργασία
Εξάγετε αποτελέσματα ως HEX, RGB, HSL, CSS, JSON ή αντιγράψτε με ένα κλικ. Ιδανικό για κοινή χρήση οδηγού χρωμάτων με την ομάδα σας.
Ανακαλύψτε όλα τα εργαλεία χρωμάτων
Εξαγάγετε, μετατρέψτε, δημιουργήστε παλέτες, διαβαθμίσεις και αντιθέσεις WCAG με λίγα κλικ.
Related tools
Οδηγοί και σεμινάρια
Μάθετε πώς να χρησιμοποιείτε τα εργαλεία μας με τους λεπτομερείς οδηγούς μας.
animated-gradient: πρακτικός οδηγός για gradients
Τοπικοποιημένος οδηγός για το animated-gradient, καλές πρακτικές gradients και συχνά λάθη.
animated-gradient: πρακτικός οδηγός για gradients
Τοπικοποιημένος οδηγός για το animated-gradient, καλές πρακτικές gradients και συχνά λάθη.
animated-gradient: πρακτικός οδηγός για gradients
Τοπικοποιημένος οδηγός για το animated-gradient, καλές πρακτικές gradients και συχνά λάθη.