de.hideout-lastation.com
Paradies Für Designer Und Entwickler


Erstellen Sie Ihre eigene Schriftart Icon Set leicht mit Fontello

Wir können sehen, dass Font Icons weit verbreitet auf Websites verwendet werden, und das aus gutem Grund. Das Font Icon ist zuverlässig, sieht auf dem High-DPI-Bildschirm klar und scharf aus und lässt sich durch CSS leicht in Bezug auf die Symbolgröße, Farbe und Symbolposition anpassen. Dies macht es einfach, Zeichensymbole mit CSS3 Transforms und Transitions zu animieren.

Es gibt eine große Anzahl von Font-Icon-Sets zur sofortigen Verwendung, die jedoch nicht immer alle Ihre Bedürfnisse abdecken. Vielleicht möchten Sie Ihre Icons anpassen können . In diesem Fall ist es vielleicht besser, dass Sie ein eigenes Icon-Set erstellen.

Mit all den Tools, die wir jetzt haben, ist das Erstellen eines eigenen Font Icon- Sets nicht mehr so ​​schwierig wie früher. In diesem Post wird Ihnen gezeigt, wie Sie das leicht machen können. Lass es uns überprüfen.

Vorbereiten der Symbole

Zuerst müssen wir die Icons vorbereiten. Die Symbole müssen in Vektorform sein. Wenn Sie mit Vektoranwendungen wie Adobe Illustrator, Inkscape und CorelDraw vertraut sind, können Sie eigene Symbole erstellen. Stellen Sie sicher, dass die Symbole einheitliche Eigenschaften beibehalten, und exportieren Sie sie anschließend im SVG-Format .

Alternativ können Sie auch SVG-Symbole sammeln, die online kostenlos zur Verfügung stehen.

In diesem Beispiel verwenden wir die SVG-Symbole von Ionicons. Ionicons hat eigentlich sein eigenes Font-Icon, aber in diesem Beispiel werden wir nur ein paar extrahieren, um zu erklären, wie man sein eigenes Icon-Set erstellt.

Hier ist, was ich ausgesucht habe:

Einige dieser Symbole bestehen aus mehreren Formen. Bevor wir sie also als Font-Icon aufstellen können, müssen wir die Shapes in einem Compound zusammenführen. Öffnen Sie dazu die .svg in Illustrator. Wählen Sie alle Formen und gehen Sie zu: Objekt > Compound Path > Make .

Mach das auch mit den anderen Icons.

Schrift erstellen

Fontello macht die Erstellung von Font Icon einfach. Neben dem Abrufen von Symbolen aus beliebten Font-Icon-Sets können wir mit Fontello auch externe Icons hochladen. Ziehen Sie einfach alle ausgewählten Symbole per Drag & Drop auf Fontello . Sobald sie hochgeladen sind, wird sie im Abschnitt Benutzerdefinierte Symbole angezeigt.

Sie können auf das Stiftsymbol klicken, um die Eigenschaften des Symbols, nämlich den CSS-Namen und den Hex-Code, zu bearbeiten.

Wählen Sie Ihre benutzerdefinierten Symbole, legen Sie den Namen Ihrer Schriftart fest und klicken Sie auf die Schaltfläche Download.

Fontello wird alle notwendigen Schriftarten generieren: .svg, .eot, .ttf und .woff . und die Stylesheets plus die Demo.

Das ist es. Das Erstellen von Schriften war noch nie so einfach. Ich hoffe, Sie finden diesen Tipp hilfreich.

So bloggen Sie mit Evernote

So bloggen Sie mit Evernote

Wir haben viele Möglichkeiten zum Bloggen wie WordPress, Blogger, Tumblr und Medium, um nur einige zu nennen. Aber was ist, wenn ich sage, dass Sie tatsächlich mit Evernote bloggen können? Evernote ist nicht nur die beliebteste App für Notizen, sondern bietet auch eine offene API, mit der Entwickler eine App rund um ihre Daten und Funktionen erstellen können.Hier

(Tech- und Design-Tipps)

40+ kreative und schöne Kreditkarten-Designs

40+ kreative und schöne Kreditkarten-Designs

Kreditkarten sind eines der besten finanziellen Werkzeuge, die Sie zur Verfügung haben, wenn sie richtig benutzt werden. Es ist auch eine der besten Möglichkeiten, sich auszudrücken - Ihre Vorlieben, Abneigungen, persönlichen Vorlieben, sogar Ihr persönliches Branding, wenn Sie so wollen.Es ist mehr als nur eine Plastikkarte mit einem Banklogo. Sie

(Tech- und Design-Tipps)