CSS Gradient Generator

Δημιουργήστε γραμμικές, ακτινικές και κωνικές διαβαθμίσεις με ζωντανή προεπισκόπηση και CSS έτοιμο για αντιγραφή. Προσαρμόστε στάσεις, γωνίες και σχήματα — στη συνέχεια επικολλήστε στο φύλλο στυλ σας.

CSS Gradient Generator

Live

Type

Angle135°

Stop 1

Stop 2

Third color stopStop 3

CSS output

background: linear-gradient(135deg, #c026d3 0%, #fb923c 50%, #f43f5e 100%);

Key capabilities

Δημιουργήστε γραμμικές, ακτινικές και κωνικές διαβαθμίσεις με ζωντανή προεπισκόπηση και CSS έτοιμο για αντιγραφή.
Εκτελείται στο πρόγραμμα περιήγησής σας
Δωρεάν για χρήση

Πώς να χρησιμοποιήσεις

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

How this tool works

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

Recommended settings

Χρησιμοποιήστε πρώτα τις προεπιλεγμένες επιλογές και μετά προσαρμόστε εάν χρειάζεται

Supported formats

Text / on-page input

File size and limits

Οι πολύ περίπλοκες προεπισκοπήσεις πολλαπλών επιπέδων ενδέχεται να είναι πιο αργές σε παλαιότερα τηλέφωνα.

Privacy

Οι γεννήτριες χρωμάτων και CSS εκτελούνται εξ ολοκλήρου στο πρόγραμμα περιήγησής σας. Οι προεπισκοπήσεις και οι μετατροπές δεν ανεβάζουν ποτέ τα στυλ σας.

Common use cases

Χρησιμοποιήστε το CSS Gradient Generator όποτε χρειάζεστε: Δημιουργήστε γραμμικές, ακτινικές και κωνικές διαβαθμίσεις με ζωντανή προεπισκόπηση και CSS με δυνατότητα αντιγραφής.

Troubleshooting

Η προεπισκόπηση φαίνεται διαφορετική μετά την επικόλληση

Ελέγξτε για ανταγωνιστικά CSS στη σελίδα σας (επαναφορά, κληρονομικά χρώματα). Αντιγράψτε πρώτα τον κανόνα που δημιουργήθηκε σε ένα απομονωμένο φύλλο στυλ.

FAQ

Αυτό ανεβάζει το CSS μου;

Όχι. Οι γεννήτριες και οι μετατροπείς εκτελούνται στο πρόγραμμα περιήγησής σας με ζωντανή προεπισκόπηση.

Χρειάζομαι λογαριασμό;

Όχι. Ανοίξτε το εργαλείο, τροποποιήστε τα στοιχεία ελέγχου και αντιγράψτε το CSS.

CSS Gradient Generator