आइकॉन खोज समायोज्य आकार, रंग और स्ट्रोक के साथ ओपन-सोर्स एसवीजी आइकॉन को खोजें और अनुकूलित करें।
आइकॉन खोज
समायोज्य आकार, रंग और स्ट्रोक के साथ ओपन-सोर्स एसवीजी आइकॉन को खोजें और अनुकूलित करें।
आइकॉन्स खोजें
एक कीवर्ड टाइप करें ताकि आप कई श्रेणियों से आइकॉन्स को नाम द्वारा फ़िल्टर कर सकें।
दिखने को अनुकूलित करें
आइकॉन रंग, आकार और स्ट्रोक चौड़ाई को अपने डिज़ाइन से मेल खाने के लिए समायोजित करें।
SVG की प्रतिलिपि बनाएं
एक आइकॉन पर क्लिक करके उसके अनुकूलित SVG कोड की प्रतिलिपि बनाएं।
What Is आइकॉन खोज?
आइकॉन सर्च टूल आपको ओपन-सोर्स एसवीजी आइकॉन ब्राउज़ करने, कस्टमाइज़ करने और कॉपी करने देता है। आइकॉन नेविगेशन, एक्शन, स्टेटस इंडिकेटर और विज़ुअल कम्युनिकेशन के लिए आवश्यक यूआई तत्व हैं। यह टूल छह श्रेणियों में आइकॉन प्रदान करता है: एरो, एक्शन, यूआई, मीडिया, कम्युनिकेशन और फ़ाइलें। प्रत्येक आइकॉन स्ट्रोक-आधारित एसवीजी है जिसे आपके पसंदीदा रंग, आकार और स्ट्रोक चौड़ाई के साथ अनुकूलित किया जा सकता है। त्वरित खोज के लिए कीवर्ड द्वारा खोजें। अपने कस्टम सेटिंग्स लागू करने के साथ एसवीजी कोड को कॉपी करने के लिए किसी भी आइकॉन पर क्लिक करें। उत्पन्न एसवीजी साफ, एक्सेसिबल और एचटीएमएल में इनलाइन या स्टैंडअलोन एसवीजी फ़ाइलों के रूप में उपयोग करने के लिए तैयार है।
Why Use आइकॉन खोज?
-
व्यवस्थित आइकॉन श्रेणियाँ: तीर, क्रियाएँ, यूआई, मीडिया, और अधिक
-
आइकॉन खोज के लिए कीवर्ड सर्च
-
रंग, आकार और स्ट्रोक चौड़ाई अनुकूलन योग्य
-
स्वच्छ और सुलभ SVG कोड की एक-क्लिक प्रतिलिपि
Common Use Cases
यूआई विकास
बटन, नेविगेशन और इंटरफ़ेस तत्वों के लिए आइकॉन्स खोजें और अनुकूलित करें।
त्वरित प्रोटोटाइपिंग
मॉकअप और प्रोटोटाइप के लिए जल्दी से आइकॉन्स प्राप्त करें बिना वेब पर खोजे।
डिज़ाइन एकरूपता
एक समन्वित इंटरफ़ेस डिज़ाइन के लिए स्ट्रोक-आधारित आइकॉन्स का उपयोग करें।
दस्तावेज़ीकरण
दस्तावेज़, गाइड और README फ़ाइलों में दृश्य आइकॉन जोड़ें।
Technical Guide
एसवीजी आइकॉन <svg> तत्व का उपयोग दृश्य आकार से स्वतंत्र स्केलिंग के लिए करते हैं। स्ट्रोक-आधारित आइकॉन रंग के लिए स्ट्रोक विशेषता, रेखा मोटाई के लिए स्ट्रोक-विड्थ और रेखा समाप्ति के लिए स्ट्रोक-लाइनकैप/स्ट्रोक-लाइनजॉइन विशेषता का उपयोग करते हैं। फ़िल="नन" विशेषता यह सुनिश्चित करती है कि केवल स्ट्रोक दिखाई दें। एसवीजी आइकॉन को सीधे सीएसएस शैलीकरण के लिए एचटीएमएल में इनलाइन, <img> src के रूप में सरल उपयोग के लिए या डेटा यूआरआई के माध्यम से सीएसएस बैकग्राउंड-इमेज के रूप में उपयोग किया जा सकता है। एक्सेसिबिलिटी के लिए, सजावटी आइकॉन में भूमिका="छवि" और एरिया-लेबल विशेषताएं जोड़ें, या दृश्यमान पाठ लेबल वाले शुद्ध रूप से सजावटी आइकॉन के लिए एरिया-हिडन="सच"। एसवीजी आइकॉन बिना गुणवत्ता हानि के किसी भी आकार में सही ढंग से स्केल करते हैं। आइकॉन प्रणालियों के लिए, एसवीजी स्प्राइट शीट या एसवीजी परिभाषाओं को संदर्भित करने वाले एक आइकॉन घटक का उपयोग करने पर विचार करें। वर्तमान रंग कीवर्ड आइकॉन को माता-पिता तत्व पाठ रंग विरासत में लेने देता है।
Tips & Best Practices
-
1एकरूप स्टाइलिंग के लिए अपने प्रोजेक्ट भर में स्ट्रोक-आधारित आइकॉन्स का उपयोग करें
-
2स्वचालित रूप से टेक्स्ट रंग विरासत में मिले ताकि वर्तमान रंग को स्ट्रोक रंग में सेट करें
-
3आइकॉन आकारों को एकरूप रखें-24px एक आम मानक आकार है
-
4सुलभ आइकॉन बटन के लिए दिखाई नहीं देने वाले टेक्स्ट के साथ aria-label जोड़ें
Related Tools
सीएसएस बटन जनरेटर
रंगों, पैडिंग, सीमाओं, छाया और होवर प्रभावों के साथ कस्टम सीएसएस बटन डिज़ाइन करें।
🎨 CSS & Design
एसवीजी से सीएसएस बैकग्राउंड
डेटा यूआरआई एन्कोडिंग का उपयोग करके एसवीजी कोड को सीएसएस बैकग्राउंड-इमेज के रूप में एनकोड करें।
🎨 CSS & Design
सीएसएस वेरिएबल जनरेटर
रंग, स्पेसिंग और टाइपोग्राफी के लिए सीएसएस कस्टम प्रॉपर्टीज (वेरिएबल्स) बनाएं।
🎨 CSS & Design
एसवीजी पैटर्न जनरेटर
सीएसएस बैकग्राउंड के लिए विभिन्न आकारों के साथ एसवीजी-आधारित दोहराए जाने वाले पैटर्न बनाएं।
🎨 CSS & DesignFrequently Asked Questions
Q क्या ये आइकॉन उपयोग करने के लिए नि:शुल्क हैं?
Q क्या मैं आइकॉन रंग बदल सकता हूँ?
Q मैं अपने प्रोजेक्ट में SVG आइकॉन्स का उपयोग कैसे करूँ?
Q क्या मैं इन आइकॉन्स को React में जोड़ सकता हूँ?
Q मैं आइकॉन्स को सुलभ कैसे बना सकता हूँ?
About This Tool
आइकॉन खोज is a free online tool by FreeToolkit.ai. All processing happens directly in your browser — your data never leaves your device. No registration or installation required.