מחולל גרדיאנטים

צור מעברי צבע לינאריים או רדיאליים בכל הצבעים שתרצה, כוונן את הזווית והעתק קוד CSS מוכן להדבקה או הורד את התמונה.

צבעי הגרדיאנט
סוג
זווית 135°
לחץ להעתקה

מהו גרדיאנט?

גרדיאנט (מעבר צבע) הוא מעבר חלק בין שני צבעים או יותר. בעיצוב אתרים משתמשים בגרדיאנטים לרקעים, לכפתורים ולכותרות, כי הם מוסיפים עומק ומראה מודרני עם מעט מאוד קוד.

גרדיאנט לינארי לעומת גרדיאנט רדיאלי

בגרדיאנט לינארי הצבע משתנה לאורך קו ישר, ואת הכיוון קובעים בעזרת הזווית (0° כלפי מעלה, 90° ימינה). גרדיאנט רדיאלי מתחיל מנקודת מרכז ומתפשט במעגל. המחולל יוצר את שני הסוגים ונותן לך את קוד ה-CSS המתאים (linear-gradient או radial-gradient).

איך משתמשים בו ב-CSS

העתק את הקוד והדבק אותו במאפיין background של האלמנט. אפשר להוסיף כמה צבעים ולשנות כל אחד מהם בלחיצה. אם אתה צריך גם פלטת צבעים מתאימה, נסה את פלטות הצבעים שלנו, ולפני שאתה מניח טקסט מעל הגרדיאנט, בדוק את הניגודיות.