מחולל Neumorphism
עצב משטחי ממשק ניאומורפיים רכים ובולטים עם צללים כפולים והעתק את ה-CSS.
—
רקע הבד תואם לצבע האלמנט — זה מה שיוצר את המראה הניאומורפי הרך והבולט.
כברירת מחדל הצללים הבהירים והכהים נגזרים מצבע הבסיס. הפעל כדי להגדירם בעצמך.
אודות מחולל Neumorphism
מחולל הנאומורפיזם מעצב את מראה ה"soft UI" הרך והבולט: אלמנט שנראה כאילו נלחץ החוצה — או פנימה — מהמשטח שמאחוריו. בחרו צבע בסיס אחד והכלי מגזיר ממנו את כל השאר, כי האפקט עובד רק כאשר האלמנט והרקע שלו חולקים את אותו צבע, והעומק מגיע כולו משתי צללי-box מנוגדים.
מחוונים שולטים בגיאומטריה: גודל, רדיוס פינות, מרחק הצללים, עוצמתם וטשטושם. ארבעה מצבי צורה — שטוח, קעור, קמור ולחוץ — מחליפים את המעבר הפנימי וכיוון הצל, ובורר מקור אור מזיז את ההדגשה לכל אחת מארבע הפינות כך שהאלמנט יתאים לתאורת העיצוב שלכם.
כברירת מחדל צבעי הצל הבהיר והכהה מחושבים מצבע הבסיס, אך מצב ידני מאפשר לכם לקבוע את שניהם בעצמכם. ה-CSS שנוצר — הרקע, הרדיוס ושני צללי ה-box — נמצא במרחק לחיצה אחת.
כיצד להשתמש ב-מחולל Neumorphism
- בחרו את צבע הבסיס — הוא מוחל גם על האלמנט וגם על הקנבס שמאחוריו.
- בחרו צורה: שטוחה, קעורה, קמורה או לחוצה.
- קבעו את פינת מקור האור כדי לשלוט היכן תיפול ההדגשה.
- כווננו גודל, רדיוס פינות, מרחק, עוצמה וטשטוש באמצעות המחוונים.
- הפעילו צבעי צל ידניים אם ברצונכם לעקוף את הגוונים הבהירים והכהים הנגזרים.
- העתיקו את ה-CSS והדביקו אותו על האלמנט שלכם.