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

בונים ויזואלית, מקבלים CSS מוכן להעתקה

מחולל גרדיאנטים וצללים: בונים אותם ויזואלית עם סליידרים, רואים את התוצאה בזמן אמת ומעתיקים CSS מוכן. בגרדיאנט בוחרים שני צבעים וזווית בין 0 ל-360 מעלות, והקוד שיוצא הוא linear-gradient. בצל מכוונים מרחק כלפי מטה, טשטוש, פיזור, עוצמה, צבע ועיגול פינות, ורואים אותו על כרטיס לדוגמה. ארבע הגדרות מוכנות, עדין, רגיל, בולט ומרחף, נותנות נקודת פתיחה טובה, והעתקת הצל כוללת גם את border-radius. שימושי לכפתורים, לכרטיסים ולסקשן הפתיחה, וגם כשצריך להסביר לכלי AI איזה מראה רוצים.

שאלות נפוצות

מתי להשתמש בגרדיאנט?

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

הצל שלי נראה מלוכלך

כנראה שהעוצמה גבוהה מדי. צל טוב הוא כזה שכמעט לא שמים לב אליו: נסו עוצמה של 10 עד 20 אחוז, או אחת ההגדרות המוכנות.

אפשר גרדיאנט עם יותר משני צבעים?

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

למה הצל נופל רק למטה?

ההיסט האופקי קבוע על 0, כך שהצל נופל ישר למטה כמו מתאורה עליונה. זה המראה המקובל בממשקים.

מה זה פיזור שלילי?

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

כלים נוספים שיעניינו אתכם

כל הכלים בקטגוריה בונים אתר עם AI