مجموعة من أيقونات SVG عالية الجودة وقابلة للتخصيص، موجهة للمطورين والمصممين على حد سواء. تتضمن أيقونات للغات البرمجة، الأطر العمل، الأدوات، والخدمات السحابية، وهي متاحة كحزمة NPM أو يمكن تنزيلها مباشرة من الموقع الإلكتروني للمشروع.
🔥 الميزات الرئيسية
الميزة الوصف
⚡ محسنة (Highly optimized) الأيقونات مضغوطة وآداؤها ممتاز من حيث الحجم والسرعة.
🎨 قابلة للتخصيص يمكن تغيير الحجم، اللون، عرض الحدود، وغيرها بسهولة.
🔍 قابلة للتوسع مصممة لتبدو مثالية في أي حجم دون فقدان الجودة (لأنها SVG).
🔄 متسقة (Consistent) تتبع قواعد تصميم محددة مسبقاً لضمان تناسق الأيقونات فيما بينها.
🌗 متغيرات متعددة توجد إصدارات مختلفة للأيقونة الواحدة، مثل: وضع فاتح/داكن، أيقونة مع النص (Wordmark)، وغيرها.
⭐ مجانية ومفتوحة المصدر مرخصة تحت MIT، يمكن استخدامها في المشاريع الشخصية والتجارية دون قلق.
📦 طريقة الاستخدام (للمطورين)
التثبيت:
```bash
npm install developer-icons
# او
yarn add developer-icons
# او
pnpm add developer-icons
```
الاستخدام في React/Next.js:
```jsx
import { HtmlIcon, JavascriptIcon } from "developer-icons";
export const MyComponent = () => {
return (
<div>
<HtmlIcon className="html-icon" />
<JavascriptIcon size={52} style={{ marginLeft: 20 }} />
</div>
);
};
```
المكتبة متوافقة تماماً مع TypeScript، وتقدم دعماً ممتازاً للإكمال التلقائي للكود.
🌐 خيارات التصفح والتنزيل
إذا لم تستخدم React أو NPM، يمكنك:
1. زيارة الموقع الرسمي: xandemon.github.io/developer-icons/
2. تصفح جميع الأيقونات.
3. تحميل الأيقونات بصيغة SVG مباشرة.
🛠️ التقنيات المستخدمة في بناء المكتبة
· Astro + React + Tailwind CSS للموقع التوثيقي.
· TypeScript لضمان سلامة الكود.
· SVGO لضغط وتحسين ملفات SVG.
· Vite لبناء الحزمة.
https://github.com/xandemon/developer-icons/
