Alle Schriften werden mit einer einzigartigen CSS-Behandlung angezeigt (und mit dem Code geliefert, den Sie für eine schnelle Implementierung benötigen!). Sie werden auch alle mit Google Fonts serviert, sodass Sie mit einem schnellen Kopieren und Einfügen sofort einsatzbereit sind, ohne dass Downloads erforderlich sind!
Eine schön dicke Schrift mit guter Lesbarkeit und interessanten Buchstabenformen. Perfekt für Überschriften.
HTML
CSS
h2 { font: 400 100px/1.3 'Oleo Script', Helvetica, sans-serif; color: #2b2b2b; text-shadow: 4px 4px 0px rgba(0,0,0,0.1); }
Lobster braucht keine Einleitung, es ist in den letzten Jahren zu einem der allgegenwärtigsten Skripte auf dem Planeten geworden. Version zwei bietet Ihnen die Wahl zwischen fett und dünn.
HTML
CSS
h2 { font: 400 100px/1.3 'Lobster Two', Helvetica, sans-serif; color: #2b2b2b; text-shadow: 1px 1px 0px #ededed, 4px 4px 0px rgba(0,0,0,0.15); }
Ich liebe wirklich die ornamentale Natur dieser Schriftart, die Buchstaben sind groß, fett und wunderschön geschwungen. Verwenden Sie dies, wenn Sie ein altes Weltgefühl vermitteln möchten.
HTML
CSS
h2 { font: 400 100px/1.3 'Berkshire Swash', Helvetica, sans-serif; color: #2b2b2b; text-shadow: 1px 1px 0px #ededed, 4px 4px 0px rgba(0,0,0,0.15); }
Merienda ist nicht mein Favorit, aber es hat sicher seine Verwendungsmöglichkeiten. Die Buchstaben haben ein gebürstetes Gefühl mit scharfer Richtung, das Bewegung gut vermittelt.
HTML
CSS
h2 { font: 400 100px/1.2 'Merienda One', Helvetica, sans-serif; color: rgba(0,0,0,0.7); text-shadow: 3px 3px 3px #fff; }
„`html
Pacifico ist einfach eine großartige, runde und geschwungene Schrift, die wirklich ein einzigartiges Gefühl vermittelt. Es ist schwer, eine dicke Schrift mit so schönen Kurven und so viel Charakter zu finden, also vergewissern Sie sich, dass Sie diese bookmarken.
HTML
CSS
h2 { font: 400 100px/1.5 'Pacifico', Helvetica, sans-serif; color: #2b2b2b; text-shadow: 3px 3px 0px rgba(0,0,0,0.1), 7px 7px 0px rgba(0,0,0,0.05); }
Wenn Sie nach etwas suchen, das wirklich handgeschrieben aussieht, ist Just Another Hand eine gute Wahl. Um einen visuellen Effekt zu erzielen, habe ich Schatten verwendet, um ihm einen 3D-Effekt zu verleihen, aber es sieht großartig aus (oder sogar besser), auch ohne sie.
HTML
CSS
h2 { font: 400 100px/1.0 'Just Another Hand', Helvetica, sans-serif; color: #969595; text-shadow: 0px 3px 0px #5e5e5e, 0px 5px 0px #4d4d4d, 0px 7px 0px #3c3c3c, 0px 9px 0px #2b2b2b, 3px 8px 15px rgba(0,0,0,0.1), 3px 8px 5px rgba(0,0,0,0.3); }
Arizonia hat ein fantastisches fließendes Gefühl mit breiten Bögen und sanften Strichen. Es ist eine großartige Logo-Schriftart und fühlt sich wirklich nicht wie etwas an, das man als live Webfont erwarten würde.
HTML
CSS
h2 { font: 400 100px/1.3 'Arizonia', Helvetica, sans-serif; color: #2b2b2b; text-shadow: 4px 4px 0px rgba(0,0,0,0.1); }
Cookie hat eine Art femininen Märchencharme, der es zu einer großartigen Schrift für Story-Überschriften und Ähnliches macht. Das nächste Mal, wenn Sie eine verspielte Note benötigen, sollten Sie es ausprobieren.
HTML
CSS
h2 { font: 400 130px/0.8 'Cookie', Helvetica, sans-serif; color: #fff; text-shadow: 4px 4px 3px rgba(0,0,0,0.1); }
Great Vibes ist eine sehr kunstvolle Schrift wie Arizonia, aber etwas dünner und raffinierter. Die Buchstabenformen sind wirklich schön und ziehen sicherlich Aufmerksamkeit auf sich.
HTML
CSS
h2 { font: 400 130px/0.8 'Great Vibes', Helvetica, sans-serif; color: #fff; text-shadow: 4px 4px 3px rgba(0,0,0,0.1); }
Leckerli One ist fett und zweckmäßig. Es ist ziemlich maskulin, soweit Schriften gehen, und perfekt für große, kühne Aussagen.
HTML
CSS
h2 { font: 400 100px/1.2 'Leckerli One', Helvetica, sans -serif; color: #000; text-shadow: 2px 2px 0px rgba(0,0,0,0.2), 4px 4px 8px rgba(0,0,0,0.2); }
Welche ist dein Favorit?
Da haben Sie es, zehn großartige Script- und handgeschriebene Schriftarten, servierfertig und bereit zur Implementierung. Die Google Font-Bibliothek hat weit über hundert davon, aber viele davon lohnen sich wirklich nicht, sie überhaupt zu verwenden. Hoffentlich hilft Ihnen dieser Artikel dabei, die Spreu vom Weizen zu trennen.
Welche der obigen Schriften ist Ihr Favorit? Haben Sie eine davon in Live-Beispielen verwendet? Wir möchten es sehen!