CSS Gradient Generator
Δημιουργήστε διαβαθμίσεις CSS οπτικά: γραμμικός, ακτινωτός ή κωνικός τύπος, ρυθμιστικό γωνίας και έως έξι χρωματικές στάσεις με ζωντανή προεπισκόπηση πλήρους πλάτους και αντιγράψιμο κώδικα.
Αποτέλεσμα
Η γραφή γραμμικής διαβάθμισης (135 μοίρες, #2193b0 0%, #6dd5ed 100%) με το χέρι και η επαναφόρτωση της σελίδας για να τη δείτε είναι ένας αργός βρόχος. Αυτή η γεννήτρια το κλείνει: επιλέξτε γραμμικό, ακτινωτό ή κωνικό, σύρετε το ρυθμιστικό γωνίας, ορίστε κάθε στάση χρώματος με έναν εγγενή επιλογέα χρώματος και μια θέση ποσοστού — και η προεπισκόπηση πλήρους πλάτους ξαναβάφεται σε κάθε είσοδο, με την τελική γραμμή φόντου πάντα έτοιμη για αντιγραφή.
Οι τρεις τύποι ντεγκραντέ καλύπτουν διαφορετικές εργασίες. Οι γραμμικές κλίσεις εξασθενούν κατά μήκος μιας κατεύθυνσης και φέρουν τα περισσότερα τμήματα και κουμπιά ηρώων. Οι ακτινικές κλίσεις ακτινοβολούν από το κέντρο για λάμψεις και βινιέτες. κωνικές διαβαθμίσεις σαρώνουν γύρω από το κέντρο και τα γραφήματα πίτας ισχύος και τους χρωματικούς τροχούς. Μπορείτε να αλλάξετε τύπους ανά πάσα στιγμή — οι στάσεις σας συνεχίζονται, επομένως η σύγκριση των τριών διαρκεί δευτερόλεπτα.
Έως και έξι χρωματικές στάσεις σάς δίνουν χώρο για σχέδια πολλαπλών ζωνών και οι προκαθορισμένες σελίδες προσφέρουν αποδεδειγμένους συνδυασμούς - ένα ζεστό ηλιοβασίλεμα, έναν ήρεμο ωκεανό και ένα απαλό ζευγάρι παστέλ - ως σημεία εκκίνησης που μπορείτε να τροποποιήσετε αντί για κενούς καμβάδες. Σημειώστε τον καταμερισμό εργασίας: η γεννήτρια χρωματικής παλέτας σε αυτόν τον ιστότοπο επιλέγει αρμονικά επίπεδα χρώματα και ο μετατροπέας μορφής χρώματος μεταφράζει μια τιμή μεταξύ HEX, RGB και HSL, ενώ αυτό το εργαλείο κάνει διαφορετική δουλειά — μετατρέπει τα επιλεγμένα χρώματα σε έτοιμο κώδικα διαβάθμισης CSS.
Τα πάντα εκτελούνται τοπικά στο πρόγραμμα περιήγησής σας: καμία μεταφόρτωση, κανένας λογαριασμός, κανένας διακομιστής μετ' επιστροφής και η γεννήτρια συνεχίζει να λειτουργεί εκτός σύνδεσης μόλις φορτωθεί.