راکت
حل شده

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

12 پاسخ

سلام
موردی مناسب برای آیکون به جز بوت استرپ (رایگان) که سبک باشه می شناسید ؟
خودم موارد دیگر رو تست کردم لطفا مواردی که کمتر باهاش برخورد داریم رو معرفی کنید

ثبت پرسش جدید

پاسخ‌ها

12
حسن حکمتی
حسن حکمتی
@hekmati

تخصص: برنامه نویس وب و بلاکچین

بهترین پاسخ

سلام
یه راه دیگه هست می تونید آیکن رو به صورت base64 قرار بدید، چون به صورت باینری encode میشه سرعت بارگذاری در این حالت بیشتره.
اینجا می تونید فایل رو تبدیل کنید.

Ibo Kiani
Ibo Kiani
@abdoki7788

تخصص: Backend developer

من مدتی پیش به این برخورده بودم . خیلی زیبا و سبکه

علیرضا کفایتی
علیرضا کفایتی
@alirezakefayati

تخصص: برنامه نویس laravel, vue.js

@abdolrahman
سلام
عالی بود ، ممنون

شاید پاسخ شما همین‌جا باشد

Matio
Matio
@matio

تخصص: برنامه نویس

سلام وقت بخیر.
آیکومون این هم می تونه خوب باشه.

عرفان محسنی
عرفان محسنی
@erfanmohseni406

تخصص: backend developer

سالار فقط fontawesome

سبحان مولایی
سبحان مولایی
@websaz

تخصص: برنامه‌نویس وب: Python :: Django :: Node :: Php :: Laravel :: JS :: React :: React Native

سلام من خودم به شخصه fontawesome رو خیلی دوست دارم. ( البته فکر کنم کمی سنگین باشه) این سایت هم ایکون های خوبی رو گفته

میلاد-م
میلاد-م
@milad

تخصص: توسعه‌دهنده رابط کاربری - Front-End

چون حجم مسئله اصلی تون هستش، این منبع براتون سودمند هستش:
https://ionic.io/ionicons
می تونید شکل هایی که توی پروژه تون استفاده شده رو انتخاب کنید، و فقط همون هارو شامل بشه. بر همین اساس شکل اضافه ای ندارید و حداقل حجم رو در دسترس دارید.

محمدصادق عبداللهی
محمدصادق عبداللهی
@mimsadAlef

تخصص: junior full stack developer

این آموزش رو ببینید
لینک
این شما رو از پکیج های آیکون راحت می کنه :)

فاطمه کاظمی زاده
فاطمه کاظمی زاده
@kazemi

تخصص: Senior front-end در هولدینگ دکتر کرمانی - مدرس مجتمع فنی

من یه روش پیدا کردم برای استفاده از آیکنهای svg نه بصورت پکیج ولی بصورت خیلی سااااااده که کدهات زشت نشه
خواستین بگید اینجا آموزش بدم

Matio
Matio
@matio

تخصص: برنامه نویس

@hekmati کاش بیشتر توضیح می دادید. یعنی برای آیکون های font awesome هم میشه این کار رو انجام بدیم؟

با تشکر

mimv
mimv
@mimV

تخصص: هیچی

@matio اگه fontAwesome رو دانلود کنید یه پوشه به اسم svgs داره که از اونجا کد svg آیکون مورد نظرتون رو پیدا میکنید.
بعد میتونید از این ابزار برای انکد کردن svgها استفاده کنید.
در آخر میتونید یه کد css مثل این داشته باشید:

.icon {
    width: 1em;
    height: 1em;
    font-size: 1.5rem;
    vertical-align: middle;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    display: inline-block;
}
.icon-time {
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='255' height='255' viewBox='0 0 17 17'%3E%3Cg%3E%3C/g%3E%3Cpath d='M8.666 0c-4.687 0-8.5 3.813-8.5 8.5s3.813 8.5 8.5 8.5 8.5-3.813 8.5-8.5c0-4.687-3.813-8.5-8.5-8.5zM8.666 16c-4.136 0-7.5-3.364-7.5-7.5s3.364-7.5 7.5-7.5 7.5 3.364 7.5 7.5-3.364 7.5-7.5 7.5zM14 9v1h-6v-5h1v4h5z' fill='%23000000' /%3E%3C/svg%3E%0A");
}

و کد html

<i class="icon icon-time"></i>
Padra Ahani
Padra Ahani
@padraahani

تخصص: Full-Stack

سلا میتونید از material-ui استفاده بکنید

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام