Geomicons - ייחודי ייחודי ביד בקידוד SVG Iconset
אינטרנט iconsets במהירות להפוך את הנורמה עבור עיצוב אתרים מודרני. הם מאסיבית נכסים מעצבי אינטרנט כמו אלה סמלים ניתן להתאים אישית באמצעות CSS ואת גודל ללא כל אובדן איכות.
אבל כמה חבילות סמל יכול להרגיש נפוח גדול מדי עבור אתרים קטנים יותר. זה המקום שבו Geomicons באמת זורחת.
זה מותאם אישית ביד קידוד חבילת סמל פועל על SVG. ניתן להטביע את הסמלים באמצעות סקריפטים של JS, או כקובץ SVG ישיר לדף שלך. כך או כך, הם וקטורים יפה סופר קל restyle.
הדף הראשי Geomicons תכונות הדגמה מלאה של כל הסמלים. הם פשוט למדי ופעל מסורתי צבע אחד צבע בסגנון שטוח שכולנו מכירים.
אבל מידע ההתקנה שלהם הוא בהחלט חסר בדף ההדגמה. אם אתה רוצה ללמוד כיצד להגדיר את זה תצטרך לבקר את ריפו GitHub לקבלת הוראות.
כברירת מחדל, זה הספרייה מניחה שאתה עובד עם CSS / JS כדי לקבל סמלים אלה מוטבע ישירות אלמנטים בדף. עם זאת, כאשר אתה מוריד את הסמלים מ GitHub אתה מקבל את כל קבצי SVG גלם אשר ניתן להוסיף ישירות ל- HTML.
רק צרות SVGs גלם דורשים יותר עריכה כדי לשנות צבעים, ואילו המסלול JS / CSS נותן לך שליטה על הצבעים באמצעות הקוד.
פשוט להוסיף את geomicons.min.js סקריפט לתוך הכותרת שלך לעבור את סמל נתונים תכונה אלמנטים HTML. אלה באופן אוטומטי להטביע סמלים אשר ניתן מכן לתפעל באמצעות CSS שיעורים.
דבר נוסף שאני באמת אוהב על Geomicons הוא תמיכה הצומת. הנה קטע לדוגמה מתוך ריפו של GitHub:
var geomicons = דורשים ('geomicons-open'); var pathData = geomicons.paths.heart; // מחזירה את ערך המאפיין d של הנתיב var svgString = geomicons.toString ('heart'); // מחזירה מחרוזת SVG אם אתה לא מכיר את הצומת אז אתה כנראה לעולם לא צריך להשתמש בכל קטעי הצומת. כנ"ל לגבי הגירסה React.js של סמלים אלה.
עדיין יש תמיכה במסגרות הגדולות הוא עניין גדול. זה יותר הוכחה כי Geomicons נועדו תמיכה בכל סוג של אתר אינטרנט על ידי התמקדות בביצועים הראשון.
כדי לתת את הסמלים האלה לרוץ לרוץ אתה יכול למשוך עותק דרך npm או להוריד אותם ישירות באמצעות GitHub.
יש גם איקט מתאר מתאר שנקרא Geomicons Wired כי ייתכן שתרצה לבדוק גם כן.
כך או כך, זהו זוהר מבריק עבור מעצבי אינטרנט מינימליסטי. בחירה מושלמת לאופטימיזציה של האתר שלך עם סמלים יפים תוך הפחתת זמני טעינת הדף הכוללים.
