پرش به محتوا
۰۲۱۷۱۰۵۷۵۸۵ ۹ صبح تا ۱۰ شب
ورودثبت‌نام

کتابخانه

دانلود @iconscout/unicons و نشانی CDN ایرانی

@iconscout/unicons یه کتابخانه آیکون فونتی از IconScout هست که با چند خط CSS، مجموعه بزرگی از آیکون های آماده رو به سایت یا پروژه جاوااسکریپتت اضافه می کنه. برای منوها، دکمه ها و داشبوردها مناسبه و چون فونته، اندازه و رنگ آیکون ها رو مثل متن با CSS کنترل می کنی.

نسخه رسمی و بدون تغییر، از منبع رسمی با مجوز IconScout Simple License؛ هش هر فایل با منبع بررسی شده است.

آخرین نسخه
۴.۰.۱
نسخه‌ها در مخزن
۲
مجوز
IconScout Simple License
سازنده
IconScout
آخرین بررسی
آخرین به‌روزرسانی
توضیحات

آخرین نسخه

آخرین نسخه ۴.۰.۱ آخرین

۸٫۵ مگابایت · ۲۱۰۲ فایل · انتشار

دانلود(پنجره تازه)
نشانی مستقیم فایل اصلی https://mirror.wbweb.ir/npm/@iconscout/unicons@4.0.1/webpack.config.js

دانلود هفتگی جهانی

۱۶٫۶ هزار

هفته ۲۵ مهر تا ۱ آبان۲٫۲٪ کمتر از هفته قبل

دانلود هفتگی جهانی در ۱۲ هفته اخیر، از ۱۰ مرداد تا ۱ آبان؛ هفته آخر ۱۶٬۶۱۹ دانلود؛ ۲٫۲٪ کمتر از هفته قبل. منبع: npm.

منبع: npmبه‌روزرسانی آمار

کد آماده با SRI <script src="https://mirror.wbweb.ir/npm/@iconscout/unicons@4.0.1/webpack.config.js" integrity="sha256-28m/1nG+QIFiv1vuJUVtnJ9mObS7+TzxBIIjSWKa85o=" crossorigin="anonymous"></script>

SHA-256: dbc9bfd671be408162bf5bee25456d9c9f6639b4bbf93cf104822349629af39a

درباره @iconscout/unicons (یونیکونز)

اگه وسط طراحی یه پنل، فروشگاه یا قالب وردپرس برای دکمه جستجو، سبد خرید یا منوی موبایل آیکون لازم داری، @iconscout/unicons می تونه همون چیزی باشه که دنبالشی. این بسته npm مجموعه ای از آیکون های آماده رو به شکل فونت در اختیارت می ذاره. هر آیکون یه اسم داره و با یه تگ ساده و یه کلاس توی صفحه نشون داده می شه. چون با فونت کار می کنی، اندازه با font-size و رنگ با color عوض می شه، دقیقا مثل متن معمولی.

این کتابخانه برای سایت های شرکتی، فروشگاه ها، داشبوردهای مدیریت، لندینگ ها و قالب های سفارشی به کار میاد. به خصوص وقتی ده ها آیکون هم سبک می خوای و حوصله نداری برای هر کدوم یه فایل SVG جدا مدیریت کنی. ولی همه جا جواب نمی ده. اگه آیکون چند رنگ یا تصویرسازی می خوای، یا باید روی بخش های داخلی یه آیکون انیمیشن بذاری، SVG انتخاب بهتریه. اگه هم فقط سه چهار تا آیکون لازم داری، لود کردن کل فونت به صرفه نیست.

چند نکته رو قبل از انتخاب بدون. اول مجوز: طبق اطلاعات بسته، با IconScout Simple License منتشر شده. اگه قراره آیکون ها توی یه قالب یا محصول قابل فروش برن، متن مجوز رو خودت بخون و شرایطش رو بررسی کن. دوم جهت راست به چپ: فونت آیکون جهت رو خودش عوض نمی کنه. فلش «بعدی» توی سایت فارسی باید به چپ اشاره کنه، پس یا آیکون قرینه رو انتخاب کن یا با CSS برش گردون. سوم دسترسی پذیری: آیکون های تزئینی رو با aria-hidden از صفحه خوان مخفی کن و برای دکمه ای که فقط آیکون داره، یه برچسب متنی بذار. چهارم، که برای ما ایرانی ها مهم تره: فونت رو از CDN خارجی لود نکن. وقتی اینترنت بین الملل مختل می شه، به جای آیکون یه مربع خالی می بینی. فایل ها رو روی هاست خودت نگه دار.

سبک آیکون ها هم مهمه. این مجموعه چند سبک داره، مثل خطی و توپر. قبل از شروع، محتوای بسته رو نگاه کن و یه سبک رو برای کل سایت انتخاب کن. قاطی کردن سبک ها ظاهر طراحی رو به هم می ریزه.

نسخه های رسمی و بدون تغییر این بسته توی مخزن داخلی ما هم در دسترسه. پس حتی وقتی دسترسی به npm یا سایت های خارجی سخت می شه، می تونی از همین جا دانلودش کنی.

راهنمای استفاده

راه انداختن این کتابخانه کار پیچیده ای نیست. قدم های کلی اینه:

  • بسته رو از مخزن ما دانلود کن، یا اگه با npm کار می کنی، با اسم @iconscout/unicons نصبش کن.
  • فایل های CSS و فونت رو کنار هم روی هاست یا توی پروژه بذار. بعد از جابه جایی، مسیر فونت ها توی فایل CSS رو چک کن که خراب نشده باشه.
  • فایل CSS سبکی که انتخاب کردی رو توی head صفحه لود کن. اگه پروژه بسته ساز داره، با import بیارش.
  • اسم آیکون رو از فهرست آیکون ها پیدا کن و کلاسش رو روی یه تگ i بذار. نمونه کد آماده پایین همین صفحه هست و می تونی ازش شروع کنی.
  • اندازه و رنگ رو با CSS تنظیم کن، مثل هر متن دیگه.

توی وردپرس هم همین مسیر جواب می ده. فایل ها رو توی پوشه قالب بذار و CSS رو با wp_enqueue_style به صفحه اضافه کن. اگه از قالب آماده استفاده می کنی، قالب فرزند امن تره، چون با به روزرسانی قالب فایل هات از بین نمی رن. بعدش آیکون ها رو توی ویجت ها، منوها یا فایل های قالب با همون تگ i استفاده کن.

آخرش تب Network مرورگر رو باز کن و مطمئن شو هیچ درخواستی به دامنه خارجی نمی ره.

همه نسخه‌ها (۲)

نسخه‌های ۴.x ۲ نسخه
  • ۴.۰.۱ آخرین نسخه ۸٫۵ مگابایت ·
    دانلودنسخه 4.0.1(پنجره تازه)
    نشانی مستقیم فایل اصلی 4.0.1 https://mirror.wbweb.ir/npm/@iconscout/unicons@4.0.1/webpack.config.js
  • ۴.۰.۰ قدیمی‌ترین نسخه ۸٫۴ مگابایت ·
    دانلودنسخه 4.0.0(پنجره تازه)
    نشانی مستقیم فایل اصلی 4.0.0 https://mirror.wbweb.ir/npm/@iconscout/unicons@4.0.0/webpack.config.js

پرسش‌های رایج

  • این بسته با IconScout Simple License منتشر شده و شرایط دقیق استفاده تجاری توی متن همین مجوز اومده. برای سایت شخصی یا شرکتی معمولا مشکلی پیش نمیاد. ولی اگه آیکون ها رو توی قالب یا محصول قابل فروش می ذاری، قبلش متن مجوز رو بخون.

  • معمولا فایل فونت لود نشده. مسیر فونت ها توی فایل CSS رو چک کن، ببین فایل ها واقعا روی هاست هستن یا نه و کش مرورگر رو پاک کن. اگه فونت رو از CDN خارجی می گرفتی، نسخه ش رو روی هاست خودت بذار و مسیر رو عوض کن.

  • خود آیکون ها مشکلی ایجاد نمی کنن، ولی جهتشون خودکار عوض نمی شه. فلش ها و آیکون های جهت دار مثل بعدی و قبلی رو باید دستی قرینه کنی یا آیکون مخالفش رو برداری. آیکون های بی جهت مثل جستجو و سبد خرید همون طور که هستن خوبن.

  • فونت آیکون برای مجموعه ای از آیکون های ساده و هم سبک راحته، چون رنگ و اندازه شون رو با CSS عوض می کنی. SVG برای تعداد کم آیکون، آیکون چند رنگ یا انیمیشن دقیق بهتره. اگه آیکون زیاد و یکدست می خوای، فونت انتخاب خوبیه.

  • emoji-datasource-apple

    ایموجی دیتا سورس اپل ·آیکون

    emoji-datasource-apple یه بسته npm با مجوز MIT از پروژه emoji-data است که تصویرهای ایموجی به سبک اپل رو همراه با یه فایل داده در اختیارت می ذاره. توی فایل داده نام، کد یونیکد و دسته هر ایموجی هست. اگه می خوای ایموجی ها روی همه دستگاه ها و مرورگرها دقیقاً یک شکل دیده بشن، به کارت میاد.

    آخرین نسخه
    ۱۶.۰.۰
    نسخه‌ها
    ۶
    به‌روزرسانی

  • bootstrap-icons

    بوت استرپ آیکونز ·آیکون

    bootstrap-icons کتابخانه آیکون رسمی و متن باز بوت استرپه. مجموعه بزرگی از آیکون های SVG رو به شکل فایل SVG، فونت آیکون و اسپرایت بهت می ده. می تونی تو قالب، سایت وردپرسی و هر پروژه وب، با بوت استرپ یا بدون اون، ازش استفاده کنی. مجوزش MIT هست.

    آخرین نسخه
    ۱.۱۳.۲
    نسخه‌ها
    ۲۱
    به‌روزرسانی

  • @mdi/font

    متریال دیزاین آیکونز ·آیکون

    @mdi/font بسته آماده وب فونت Material Design Icons هست که آیکون های اصلی و آیکون های جامعه کاربری رو توی یه فونت جمع کرده. با یه فایل CSS و چند کلاس ساده می تونی هزاران آیکون رو توی سایت وردپرسی یا هر پروژه وب نشون بدی، بدون اینکه برای هر آیکون یه تصویر جدا لازم باشه.

    آخرین نسخه
    ۷.۴.۴۷
    نسخه‌ها
    ۱۰
    به‌روزرسانی

  • @alaskaairux/icons

    آیکون های آلاسکا ایر (Auro) ·آیکون

    @alaskaairux/icons یه بسته npm شامل مجموعه آیکون های سیستم طراحی Auro و Alaska Air است که تیم طراحی و پژوهش Alaska Air منتشر کرده. اگه برای سایت یا اپ وب یه مجموعه آیکون هم سبک و تمیز می خوای، با مجوز Apache می تونی ازش استفاده کنی و فایل ها رو روی هاست خودت نگه داری.

    آخرین نسخه
    ۵.۳۰.۰
    نسخه‌ها
    ۵۷
    به‌روزرسانی

  • @fortawesome/fontawesome-free

    فونت اوسام ·آیکون

    @fortawesome/fontawesome-free بسته رسمی npm برای نسخه رایگان Font Awesome است. یه مجموعه آیکون آماده که هم با فونت و CSS و هم با SVG و جاوااسکریپت توی سایت کار می کنه. برای منو، دکمه، فوتر، لینک شبکه های اجتماعی و هر جایی که آیکون لازم داری به کارت می آد.

    آخرین نسخه
    ۷.۳.۱
    نسخه‌ها
    ۲۲
    به‌روزرسانی

  • ionicons

    آیونیکونز ·آیکون

    ionicons یه مجموعه آیکون SVG متن باز برای پروژه های وب و اپ موبایله که تیم Ionic ساخته. بیشتر آیکون هاش سه حالت توپر، خطی و تیز دارن و با یه المان نشون داده می شن. تو سایت وردپرسی، قالب سفارشی یا پنل مدیریت می تونی بدون فونت آیکون و بدون وابستگی به فریم ورک ازش استفاده کنی.

    آخرین نسخه
    ۸.۱.۰
    نسخه‌ها
    ۲۲
    به‌روزرسانی

چیزی که لازم دارید اینجا نیست؟

نام کتابخانه، افزونه یا قالب را بفرستید؛ پس از بررسی، نسخه‌های رسمی آن به مخزن اضافه می‌شود.