devicon
v2.16.0
العرض التوضيحي · طلب أيقونة · المساهمة
<!-- in your header -->
< link rel =" stylesheet " href =" https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css " >
<!-- in your body -->
< i class =" devicon-devicon-plain " > </ i > develop مقابل master يهدف Devicon إلى جمع جميع الشعارات التي تمثل لغات وأدوات التطوير. يأتي كل رمز في عدة إصدارات: الخط/SVG ، الأصلي/العادي/الخط ، الملون/غير الملون ، علامة الكلمات/لا كلمة. Devicon لديه 150+ أيقونات. وينمو!
راجع Devicon.json أو موقع الويب الخاص بنا للحصول على مرجع كامل وحديث لجميع الرموز المتاحة.
شكرا لجميع المساهمين لدينا وتطبيق icomoon. لن يكون Devicon ممكنًا بدونك.
جميع أسماء المنتجات والشعارات والعلامات التجارية هي ملك لأصحابها. جميع أسماء الشركة والمنتجات والخدمات المستخدمة في هذا الموقع هي لأغراض تحديد الهوية فقط. لا يعني استخدام هذه الأسماء والشعارات والعلامات التجارية تأييدًا. يجب أن يتم استخدام هذه الشعارات وفقًا لسياسة العلامة التجارية للشركة/العلامة التجارية/الخدمة. لإعداد سريع للغاية ، اذهب للتحقق من devicon.dev.
يمكنك إما استخدام أيقونات SVG RAW ، أو خط Devicon الخاص بنا (والذي يتوفر أيضًا عبر CDN) ، أو عن طريق بناء Devicon بنفسك.
devicon (موصى به) يمكنك تثبيت Devicon كاعتماد على مشروعك إما باستخدام npm أو yarn :
npm install --save devicon
yarn add deviconإذا كنت لا ترغب في استخدام مدير الحزمة ، فيمكنك أيضًا تنزيل وتضمين Devicon.min.css بجوار ملفات الخطوط إلى مشروعك. انظر Devicon.dev للحصول على تفاصيل حول كيفية إضافة Devicon إلى مشروعك عبر CDN.
بعد إعدادك فقط ، يجب عليك تضمين ورقة الأنماط في رأسك للبدء:
< link rel =" stylesheet " href =" devicon.min.css " > ابدأ في استخدام الرموز مع <i> -tag:
<!-- for devicon plain version -->
< i class =" devicon-devicon-plain " > </ i >
<!-- for devicon plain version with wordmark -->
< i class =" devicon-devicon-plain-wordmark " > </ i >
<!-- for devicon plain version colored with devicon main color -->
< i class =" devicon-devicon-plain colored " > </ i >
<!-- for devicon plain version with wordmark colored with devicon main color -->
< i class =" devicon-devicon-plain-wordmark colored " > </ i > طريقة بديلة لاستخدام devicon هي عن طريق نسخة/لصق رمز SVG RAW لمشروعك.
<!-- for devicon plain version -->
< svg id =" Devicon " class =' devicon-devicon-plain ' xmlns =" http://www.w3.org/2000/svg " viewBox =" 0 0 128 128 " > < path id =" plain " fill =" #60be86 " d =" M64,7.83H4.77L14.95,95.13l49,25,.06,0,49.07-25L123.23,7.83Zm42.77,54.86c0,.88,0,1.67-.77,2L73.25,80.44l-2.42,1.13-.27-3.15V72.23l.24-1.57,1.09-.47L95.07,59.81l-21.54-9.6L64.35,68.34,58.9,78.87l-1.22,2.27-2.05-.9L22,64.71a2.42,2.42,0,0,1-1.45-2V56.91a2.39,2.39,0,0,1,1.42-2l34-15.73,3.21-1.44v9.66l.24,1.34-1.56.7L34.45,59.79,56.3,69.42l8.05-16,6.21-12.65,1.13-2.28,1.81.91L106,54.89c.73.35.76,1.14.76,2Z " /> </ svg >أضف قواعد CSS التالية في ورقة الأنماط الخاصة بك:
. devicon-devicon-plain {
max-width : 2 em ;
}
/* if you want to change the original color */
. devicon-devicon-plain path {
fill : # 4691f6 ;
}img والرجوع إلى SVG مباشرة من المستودع: < img src =' https://cdn.jsdelivr.net/gh/devicons/devicon@latest/icons/devicon/devicon-original.svg ' > عندما تريد أن تطلب رمزًا ، لا تتردد في إنشاء مشكلة. تحقق من wiki لدينا لمزيد من المعلومات.
نحن سعداء بكل مساهمة ، سواء كانت أيقونات أو ميزات أو محفظة جديدة. يرجى إلقاء نظرة على ويكي لدينا لمعرفة كيف يمكنك المساهمة في هذا المشروع.
لدينا مجتمع خلاف ل Devicons. يمكنك بسهولة طلب الرموز والمناقشة والوقت الجيد في التحدث مع أفراد المجتمع! انضم إلى خادم Discord الرسمي هنا!
develop مقابل master يجب أن تكون جميع الإصدارات الرسمية في master . سيتم الاحتفاظ بأي تحديثات بين (الرموز ، والميزات ، وما إلى ذلك) في develop .
develop يحتوي على:master على:بعد فتح طلب السحب لأكثر من 30 يومًا دون أي نشاط أو استجابة من المؤلف ، سيتم تمييزه تلقائيًا على أنه أمر لا معنى له. قد نتخلى عن تغييراتك وندمج التغييرات بأنفسنا. نظرًا لأن GitHub يتتبع مساهمات Commits ، سيتم الفضل في ذلك.
اتبع هذه الخطوات لإنشاء موقع الويب والأيقونات إما محليًا أو باستخدام gitpod.io.
باستخدام gitpod.io ، يمكنك بسهولة إنشاء الرموز وتثبيت
التبعيات المطلوبة في نقرة واحدة. لا يلزم إعداد إضافي.
ملاحظة في حالة عدم تشغيل بعض الأوامر بشكل صحيح ، يمكنك
اتبع الخطوات أدناه وقم بتشغيل نفس الأوامر على gitpod.io
شوكة المستودع واستنساخ المستودع المتشعب.
git clone https://github.com/ < your-github-username > /devicon.gitملاحظة في حالة عدم تثبيت GIT ، تحقق من الدليل الرسمي لتثبيت GIT على نظام التشغيل الخاص بك.
npm installملاحظة في حالة عدم تثبيت NPM ، تحقق من هذا الدليل النهائي على تثبيت Node.js و NPM. هذه الأدوات مطلوبة من أجل بناء devicon بشكل صحيح.
ملاحظة ، تأكد من أن تثبيت Python الخاص بك يتضمن Pip
python3 -m pip install --upgrade pip && pip install selenium==4.1.0 requests==2.25.1 بمجرد تثبيت جميع التبعيات ، يمكنك المتابعة لبناء أحدث الرموز.
عادةً ما يتم ذلك في كل إصدار ، ولكن يمكنك الحصول على نظرة خاطفة على التسلل قبل الإصدار.
# Linux/Unix
npm run build-icons
# Windows
python3 ./.github/scripts/icomoon_build_githubless.py ./.github/scripts/build_assets/geckodriver-v0.32.2-win64/geckodriver.exe ./icomoon.json ./devicon.json ./icons ./ --headlessقد تستغرق العملية بعض الوقت ، اعتمادًا على سرعة نظام التشغيل الخاص بك وكمية الرموز.
إذا كانت هناك أي أخطاء معروضة ، فيرجى إخبارنا عن طريق إنشاء مشكلة أو الاتصال بنا على مجتمع Discord.
قم بتشغيل الأمر التالي لبناء ورقة أنماط CSS الجديدة.
يستخدم هذا الملف لإظهار جميع الرموز الجديدة التي تم بناؤها مسبقًا.
npm run build-cssقم بتشغيل الأمر التالي لبدء خادم الويب باستخدام Python.
npm run dev # Will run on port 8000أو هذا الأمر ، الذي يفعل نفس الشيء بالضبط ، ولكن يمكن تخصيص المنفذ.
python3 -m http.server < port > لقد انتهيت الآن! ؟ يجب أن يكون بناء Devicons متاحًا على https://localhost:8000 (أو المنفذ المطلوب).
