כפתור בסגנון ניאומורפיזם

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

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

ואז נוסיף קצת קוד להצללה.

				
					selector a{
box-shadow:15px 15px 30px #bebebe,
-15px -15px 30px #ffffff;
}
				
			
וככה זה נראה

אפשר להוסיף אפקט נחמד בהובר,

				
					selector a{
box-shadow:15px 15px 30px #bebebe,
-15px -15px 30px #ffffff;
}
selector a:hover{
box-shadow:inset 15px 15px 30px #bebebe,
inset -15px -15px 30px #ffffff;
}
				
			
וככה זה נראה

מומלץ להתמש באתר הזה לשחק עם האפשרויות ולייצר את הקוד, neumorphism.io

כתיבת תגובה

האימייל לא יוצג באתר. שדות החובה מסומנים *

פעם בשבוע אני שולח ניוזלטר
עם כל המאמרים החדשים באתר
מעניין אותך?