Επιλέξτε δύο ή περισσότερα χρώματα, σύρετε τη διαβάθμιση σύμφωνα με τις προτιμήσεις σας, αντιγράψτε το CSS. Ή κατεβάστε το ως PNG για να το χρησιμοποιήσετε ως ταπετσαρία, φόντο διαφάνειας ή φόντο ανάρτησης σε μέσα κοινωνικής δικτύωσης. Υποστηρίζονται γραμμικές, ακτινικές και κωνικές διαβαθμίσεις, καθώς και μια λειτουργία πλεγματικής διαβάθμισης για τα απαλά φόντα τύπου Apple που βλέπετε σε σύγχρονες διεπαφές χρήστη.
Επεξήγηση τύπων διαβάθμισης
- Γραμμική: ευθεία γραμμή από το χρώμα Α στο χρώμα Β. Επιλογέας κατεύθυνσης (πάνω→κάτω, διαγώνια, κ.λπ.).
- Ακτινική: ομόκεντρη — το χρώμα Α στο κέντρο ξεθωριάζει προς το χρώμα Β στις άκρες. Χρήσιμο για εφέ προβολέα.
- Κωνική: περιστρέφεται γύρω από ένα κεντρικό σημείο σαν χρωματικός τροχός. Μοντέρνο στον σύγχρονο σχεδιασμό διεπαφών.
- Πλεγματική (premium): πολλαπλές κηλίδες χρώματος που αναμειγνύονται ομαλά. Η εμφάνιση "Apple gradient".
Τι μπορείτε να αντιγράψετε
- CSS: έτοιμη προς επικόλληση δήλωση
linear-gradient(...) ή background-image:.
- Tailwind: την πλησιέστερη κλάση
bg-gradient-* συν τυχόν προσθήκες προσαρμοσμένων χρωμάτων.
- SVG: για κλιμακούμενη χρήση σε εικονίδια ή γραφικά διεπαφών.
- Λήψη PNG: οποιοδήποτε μέγεθος, συμπεριλαμβανομένων ταπετσαρίας τηλεφώνου (1284×2778), επιφάνειας εργασίας (3840×2160) και τετράγωνου (1080×1080).
Συνήθεις περιπτώσεις χρήσης
- Ταπετσαρίες τηλεφώνου: οι πλεγματικές διαβαθμίσεις είναι τεράστιες στο iOS. Δοκιμάστε το iPhone Wallpaper Preview για έλεγχο.
- Φόντα αναρτήσεων σε μέσα κοινωνικής δικτύωσης: άμεση εμφάνιση επωνυμίας για γραφικά με αποσπάσματα.
- Ενότητες Hero: φόντα με διαβάθμιση είναι παντού σε σελίδες προορισμού.
- Παρουσιάσεις διαφανειών: αντικαταστήστε βαρετά συμπαγή φόντα.
Επιλογή χρωμάτων που λειτουργούν
Γειτονικά στον χρωματικό τροχό = διακριτικά, αρμονικά. Αντίθετα = τολμηρά, τραβούν την προσοχή. Προσθέστε ένα τρίτο ενδιάμεσο σημείο για να γεφυρώσετε ένα μεγάλο κενό. Για διαβαθμίσεις πιστές στην επωνυμία, επικολλήστε το HEX της επωνυμίας σας και επιλέξτε μια απόχρωση ή σκιά για το δεύτερο σημείο. Χρησιμοποιήστε το Color Converter για να βρείτε αποχρώσεις (HSL με υψηλότερη φωτεινότητα) ή σκιές (χαμηλότερη).
Συχνές ερωτήσεις
Μπορώ να τα χρησιμοποιήσω σε παραγωγή;
Ναι — το αντιγραμμένο CSS λειτουργεί σε οποιοδήποτε σύγχρονο πρόγραμμα περιήγησης. Παρέχονται εναλλακτικές SVG για παλαιότερους στόχους.
Τι γίνεται με την υποστήριξη του radial gradient στους browser;
Καθολική στους σύγχρονους browser. Η σύνταξη CSS είναι μία γραμμή.
Πόσο μεγάλο μπορώ να εξάγω το PNG;
Δωρεάν: έως 4K (3840×2160). Premium: 8K και παραπάνω.
Είναι δύσκολο να χρησιμοποιηθούν τα mesh gradients;
Στον ιστό βασίζονται σε SVG ή canvas. Σας δίνουμε ένα flattened PNG για εύκολη χρήση, καθώς και την πηγή SVG για επεξεργασία.
Μπορώ να αποθηκεύσω τις διαβαθμίσεις μου;
Συνδεθείτε (δωρεάν) και οι αποθηκευμένες διαβαθμίσεις εμφανίζονται στη βιβλιοθήκη σας.
Τι είναι μια 'κωνική' διαβάθμιση;
Σαρώνει γύρω από ένα σημείο — σαν ένας χρωματικός τροχός ή ένα γράφημα πίτας. Η σύγχρονη CSS την υποστηρίζει εγγενώς.
Λειτουργεί για κινούμενες διαβαθμίσεις;
Μόνο για στατική εξαγωγή. Για κινούμενα φόντο, αντιγράψτε το CSS και προσθέστε ένα CSS animation γύρω από τη γωνία της διαβάθμισης.
Γιατί να μην γράφεις απλά CSS με το χέρι;
Μπορείς — το εργαλείο απλά κάνει την οπτική επανάληψη ταχύτερη. Αντέγραψε και προσάρμοσε.
Σχετικά Δημιουργός Gradient
Δημιουργός Gradient είναι ένα δωρεάν διαδικτυακό εργαλείο από το Wallpapers.com που λειτουργεί εξ ολοκλήρου στο πρόγραμμα περιήγησής σας — χωρίς εγκατάσταση, χωρίς υδατογράφημα, χωρίς εγγραφή email για την πρώτη δοκιμή.
Δημιουργήστε γραμμικές ή ακτινικές διαβαθμίσεις με έξοδο CSS αντιγραφής-επικόλλησης.
Πώς να το χρησιμοποιήσετε Δημιουργός Gradient
- Επιλέξτε ένα χρώμα από το δείγμα ή επικολλήστε μια τιμή HEX / RGB.
- Προσαρμόστε την έξοδο — παλέτα, αντίθεση, συμπληρωματικά χρώματα.
- Αντιγράψτε την τιμή ή εξάγετε το δείγμα ως JSON.
Πότε να το χρησιμοποιήσετε
Συνήθεις περιπτώσεις χρήσης περιλαμβάνουν:
προετοιμασία εικόνων για μεταφόρτωση στο διαδίκτυο, καταχωρίσεις ηλεκτρονικού εμπορίου, πλατφόρμες κοινωνικής δικτύωσης με περιορισμούς μορφής και μετατροπή αρχείων από μια συσκευή ή εφαρμογή σε άλλη.
Δωρεάν έναντι Premium
Κάθε επισκέπτης λαμβάνει μια δωρεάν δοκιμή· οι συνδεδεμένοι δωρεάν χρήστες έχουν υψηλότερο ημερήσιο όριο. Εγγραφείτε στο
Premium
για απεριόριστες εκτελέσεις, μαζική επεξεργασία έως 200 εικόνων ανά εργασία, ουρά προτεραιότητας και περιήγηση χωρίς διαφημίσεις.
Σχετικά εργαλεία
Ψάχνετε για κάτι λίγο διαφορετικό; Δοκιμάστε το
Ανιχνευτής Χρωμάτων από Εικόνα
,
Εξαγωγέας Παλέτας
ή
Μετατροπέας Γκρίζου
— ή περιηγηθείτε σε όλες
Εργαλεία Χρωμάτων Εργαλεία.
