0

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

בנה מעברי CSS בצורה ויזואלית: סוג ליניארי, רדיאלי או חרוטי, מחוון זווית ועד שש עצירות צבע עם תצוגה מקדימה חיה ברוחב מלא וקוד שניתן להעתיק.

90°
מעבד... 0%

תוצאה

Writing linear-gradient(135deg, #2193b0 0%, #6dd5ed 100%) by hand and reloading the page to see it is a slow loop. המחולל הזה סוגר אותו: בחר ליניארי, רדיאלי או חרוטי, גרור את מחוון הזווית, הגדר כל עצירת צבע עם בורר צבע מקורי ומיקום אחוז - והתצוגה המקדימה ברוחב המלא נצבעת מחדש בכל קלט בודד, כשקו הרקע המוגמר תמיד מוכן להעתקה.

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

עד שש עצירות צבע נותנות לך מקום לעיצובים מרובי-להקות, והדפים המוגדרים מראש מספקים שילובים מוכחים - שקיעה חמה, אוקיינוס ​​רגוע וזוג פסטל רך - כנקודות התחלה שאתה יכול לצבוט במקום קנבסים ריקים. שימו לב לחלוקת העבודה: מחולל פלטות הצבעים באתר זה בוחר צבעים שטוחים הרמוניים וממיר פורמט הצבעים מתרגם ערך בין HEX, RGB ו-HSL, בעוד שהכלי הזה עושה עבודה אחרת - הוא הופך את הצבעים הנבחרים לקוד גרדיאנט CSS מוכן.

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