परिचय

Kubai Icons होवर मोशन वाले लेयर्ड SVG आइकन की ओपन-सोर्स लाइब्रेरी है। यह पेज पैकेज सूचीबद्ध करता है और बताता है कि आइकन के नाम और संस्करण कैसे तय होते हैं।

हर आइकन अपने सारे शेड एक ही एक्सेंट रंग से लेता है। होवर करने पर वह दिखाता है कि वस्तु क्या करती है: फ़ोल्डर खुलता है, लिफ़ाफ़ा खुलता है। हर आइकन एक अलग ES मॉड्यूल है जिसमें उसकी स्थिर अवस्था का SVG markup, यानी रेस्ट पोज़, और उसका होवर मोशन होता है।

पैकेज

पैकेजइसके लिए उपयोग करेंडॉक्स
kubai-icons-reactReact 18+ और Next.js, सर्वर रेंडरिंग सहितReact पैकेज
kubai-icons-vueVue 3.3+ और NuxtVue पैकेज
kubai-iconsसादा JavaScript और <kubai-icon> web componentJavaScript पैकेज
kubai-icons-static<img> टैग, डिज़ाइन टूल और बिना JavaScript वाले पेजों के लिए SVG फ़ाइलेंस्टैटिक SVG पैकेज

क्विक स्टार्ट

यह उदाहरण React उपयोग करता है। दूसरे वातावरण के लिए ऊपर सूचीबद्ध पैकेज देखें। पैकेज इंस्टॉल करें:

bash
npm install kubai-icons-react

फिर जो आइकन चाहिए उन्हें इंपोर्ट करें:

tsx
import { Folder, MailPlus } from "kubai-icons-react";

export default function App() {
  return (
    <>
      <Folder />                                 {/* 24px, in the text color */}
      <MailPlus size={32} color="#EC4899" />     {/* any CSS color */}
    </>
  );
}

आइकन के नाम

आइकन के नाम अंग्रेज़ी में और kebab-case में होते हैं: folder, cloud-rain, arrow-up-right। JavaScript, React और Vue पैकेज उन्हें PascalCase में export करते हैं, जैसे CloudRain। React और Vue CloudRainIcon भी export करते हैं। स्टैटिक फ़ाइलें kebab-case नाम ही रखती हैं। आइकन ब्राउज़र नाम और टैग खोजता है।

कई बेस आइकन बैज वाले रूप में भी मिलते हैं, जैसे folder-plus, user-check और calendar-clock। जिन चीज़ों को बंद किया जा सकता है, उनके आइकन तिरछी रेखा वाले रूप में भी मिलते हैं, जैसे bell-off।

संस्करण

पैकेज semantic versioning का पालन करते हैं और एक साथ रिलीज़ होते हैं। आइकन का नाम बदलना या उसे हटाना breaking change है; उसे दोबारा बनाना नहीं है। रिलीज़ नोट GitHub पर प्रकाशित होते हैं।

Kubai Icons मुफ़्त है प्रोजेक्ट को स्पॉन्सर करें