नियोमॉर्फ़िज़्म CSS जनरेटर
नरम, उभरी हुई UI सतहें बनाएँ।
नियोमॉर्फ़िज़्म मिलते-जुलते बैकग्राउंड पर हल्की और गहरी छायाओं का उपयोग करके तत्वों को नरम उभार देता है। बैकग्राउंड, दूरी, तीव्रता और रेडियस सेट करें और CSS कॉपी करें।
सतह का रंग
20px
60%
16px
background: #e0e5ec; border-radius: 16px; box-shadow: 20px 20px 30px rgba(174, 181, 195, 0.60), -20px -20px 30px rgba(255, 255, 255, 0.60);
नियोमॉर्फ़िज़्म कैसे बनाएँ
- बैकग्राउंड रंग चुनें; नरम पेस्टल ग्रे सबसे अच्छे लगते हैं।
- लाइट या डार्क मोड चुनें।
- स्लाइडर से दूरी, तीव्रता और रेडियस समायोजित करें।
- CSS कॉपी करें और उसी बैकग्राउंड रंग वाले तत्वों पर उपयोग करें।
अक्सर पूछे जाने वाले प्रश्न
तत्व को बैकग्राउंड रंग साझा क्यों करना चाहिए?
यह भ्रम दोनों छायाओं के एक ही सतह रंग में घुलने पर निर्भर करता है, इसलिए तत्व और उसका पैरेंट मेल खाने चाहिए।
लाइट और डार्क मोड में क्या अंतर है?
डार्क मोड गहरे बैकग्राउंड पर सूक्ष्म सफ़ेद और काली छायाओं का उपयोग करता है, न कि क्लासिक हल्के-भूरे रूप का।
क्या नियोमॉर्फ़िज़्म सुलभ है?
पाठ के लिए पर्याप्त कंट्रास्ट के साथ उपयोग करें और संवादात्मकता दिखाने के लिए केवल छाया पर निर्भर न रहें।