बटन, उपयोगकर्ता की कार्रवाइयों के लिए मुख्य विज़ुअल इंडिकेटर होते हैं.

सिद्धांत
कार्रवाई के लिए तैयार: बटन से साफ़ तौर पर पता चलना चाहिए कि वे किसी कार्रवाई को ट्रिगर करते हैं.
साफ़ तौर पर दिखने वाला फ़ीडबैक: बटन की बनावट, इंटरैक्शन की अलग-अलग स्थितियों (होवर, दबाना, फ़ोकस) में अलग-अलग दिखनी चाहिए, ताकि तुरंत फ़ीडबैक मिल सके.
एक जैसे: सभी बटन एक जैसे दिखने चाहिए, ताकि उन्हें तुरंत पहचाना जा सके.
लचीला: बटन कॉम्पोनेंट में सामान्य बदलाव किए जा सकते हैं. जैसे, आइकॉन और अलग-अलग साइज़ शामिल करना. हालांकि, ऐसा करते समय यह ध्यान रखना होगा कि बटन की स्टाइल में कोई बदलाव न हो.
इस्तेमाल और प्लेसमेंट
बटन को उससे जुड़े कॉन्टेंट के आस-पास रखा जाना चाहिए. इन्हें अलग से या कार्ड और सूचियों जैसे अन्य कॉम्पोनेंट के साथ रखा जा सकता है.
यह करें
यह न करें
यह करें
यह न करें
शरीर-रचना विज्ञान
डिफ़ॉल्ट
1. चालू है: डिफ़ॉल्ट स्थिति.
2. कर्सर घुमाएं
3. टैप करें
बड़ा
1. चालू है: डिफ़ॉल्ट स्थिति.
2. कर्सर घुमाएं
3. टैप करें
पसंद के मुताबिक बनाएं
बटन में डिफ़ॉल्ट और बड़े वैरिएंट के साथ-साथ, हर बटन के लिए डिफ़ॉल्ट, फ़ोकस किए गए, और दबाए गए स्टेटस शामिल होते हैं. बटन को ज़्यादा अहमियत देने, उसके बारे में ज़्यादा जानकारी देने, और उसे पहचानने के लिए आइकॉन का इस्तेमाल किया जा सकता है. बटन के साइज़ से, उसकी अहमियत को हाइलाइट किया जा सकता है.
डिफ़ॉल्ट
| प्रॉपर्टी | पसंद के मुताबिक बनाएं | डिफ़ॉल्ट |
|---|---|---|
| आकार | हां | बड़ा, सर्कल |
| पैडिंग | हां | 16 डीपी, 8 डीपी |
| बॉर्डर | हां | 2 dp, #606460 |
| टेक्स्ट | हां | Body Small |
| लीडिंग आइकॉन | हां | 40 डीपी |
| ट्रेलिंग आइकॉन | हां | 40 डीपी |
| साइज़ | हां | कम से कम 56 डीपी ऊंचाई |
| डेप्थ | हां | 0 |
बड़ा
| प्रॉपर्टी | पसंद के मुताबिक बनाएं | डिफ़ॉल्ट |
|---|---|---|
| आकार | हां | बड़ा, सर्कल |
| पैडिंग | हां | 20 dp, 8 dp |
| बॉर्डर | हां | 2 dp, #606460 |
| टेक्स्ट | हां | Body Small |
| लीडिंग आइकॉन | हां | 56 डीपी |
| ट्रेलिंग आइकॉन | हां | 56 डीपी |
| साइज़ | हां | कम से कम 72 डीपी की ऊंचाई |
| डेप्थ | हां | 0 |
| Surface | नहीं |