Este es una muestra de como algunos sitios web utilizan Google Fonts (https://www.google.com/fonts) en sus diseños. Estas maravillosas fuentes son gratiutas y realmente cambiaron la forma de presentar contenidos en la Web. Puedes utilizarlas cuando y como quieras!
Si estas buscando como ahorrar dinero, en lugar de utilizar costosas fuentes de letras de pago como las del mercado, y que además puedes utilizar las en tu sitio web, te recomendamos que revises el listado siguiente por si encuentras la inspiración que te hace falta.
Recuerda que en MasterBip.cl somos especialistas en Diseño Web, WordPress y sitios de comercio electrónico!
Keen to add typographic personality to your next website without breaking the bank? Check out these free web fonts.
It’s time-consuming to cut through the ocean of mediocre web fonts to find the real gems that punch above their (zero) price tag. With this in mind, we’ve rounded up the greatest free web fonts from around the web to get you started.
There are various methods to source and license web fonts, including subscription-based models such as Typekit, WebINK, Fontdeck and Fontspring, which boast libraries of quality typefaces and are becoming increasingly popular with professional designers. If you’re on a tight budget, however, or are just looking to experiment on a smaller project, there are plenty of good web fonts available at no cost if you know where to look.
Sites such as Font Squirrel are helpful, not to mention the free-to-use Google Web Fonts service and Adobe Edge Web Fonts. Powered by Typekit, this supplements the GWF library with several of Adobe’s own open source web fonts and integrates neatly with Edge and Muse. But here is our selection of the best around.
Oh, and you should also read: rules for using web fonts that some designers forget!
Free web fonts Rosario Rosario is perfect for setting paragraph type
Rosario is described by publisher Omnibus as being a classic semi-serif typeface, featuring weak contrast and smooth endings. We think it’s an excellent Humanist sans-serif addition to your type arsenal. Perfect for setting paragraph type, Rosario is named after the city where designer Héctor Gatti lives. The font has also benefited from TrueType hinting additions provided by Adobe via their Edge Web Fonts platform.
02. Roboto Slab
Free web fonts Roboto Slab Roboto Slab provides a pleasant reading experience
Roboto Slab is one variant in the wider Roboto family designed by Christian Robertson. The slab version particularly catches the eye with its geometric shapes and open curves. It works equally well as a display font or for dense copy: the letterform rhythm feels natural, making for a pleasant reading experience.
Free web fonts Oswald Oswald is a fantastic display font for headlines
One of the first fonts to be featured in Google’s Web Fonts library, Oswald has been updated more recently to include multiple weights, extended character sets and better kerning. The font is a reworking of the classic Alternate Gothic sans-serif typeface style, created by designer Vernon Adams, and is a fantastic display font for headlines and captions.
Free web fonts Stalemate Stalemate works well as an accent font
A wonderfully quaint script design by Jim Lyles, and harking back to vintage origins. This font works well as an accent or display font, adding instant “personal” impact to your typography on the page.
05. Crimson Text
Free web fonts Crimson Text Crimson Text is a solid, well proportioned serif
This wonderfully refined font makes an excellent choice for copy that requires the solidity and impact of a well proportioned serif. Designed by Sebastian Kosch in the best traditions of oldstyle typefaces such as Garamond, this features beautifully rendered ordinals and uppercase forms, making it a solid and reliable choice for many applications.
06. Gravitas One
Free web fonts Gravitas One This web font will be perfect for headers and tabs
Designed by Riccardo De Franceschi, Gravitas One is modelled on the ‘UK fat face’ – a heavy advertising type created during the industrial revolution in England. This is a font that’ll look great in a medium to large scale; perfect for headers, tabs and striking titles.
Free web fonts Jura Jura comes in four different weights, so will work well almost anywhere!
Daniel Johnson wanted to create a Roman alphabet using the same kinds of strokes and curves as the Kayah Li glyphs. Jura was born and has been expanded to include glyphs for the Cyrillic and Greek alphabets. It’s available in light, book, medium, and demibold weights.
08. League Gothic
Free web fonts League Gothic The League of Moveable Type deliver another stellar web font
Originally designed by Morris Fuller Benton for the American Type Founders Company in 1903, League Gothic has been given a new lease of life thanks to The League of Moveable Type. Thanks to a commission from WND.com, it’s been revised and updated with contributions from Micah Rich, Tyler Finck, and Dannci, who have contributed the extra glyphs.
Free web fonts Fjord Fjord is perfect for content on the web
Fjord is a serif typeface, originally designed with printed books in mind, and particularly intended for long texts in small print sizes. This will look great for your longer content on the web as it features sturdy construction, prominent serifs, low-contrast modulation and long elegant ascenders and descenders relative to the ‘x’ height.
Free web fonts Amaranth Play around with Amaranth and see what works for your site
The Amaranth family is a friendly upright italic design with a slight contrast and distinctive curves. With its three new styles Amaranth works really well with almost any text type. This is a font perfect for playing around with – see what works!
Free web fonts Poly This free web font was originally designed for the Wayuunaiki language
Developed as a postgrad project by Argentine type designer José Nicolás Silva Schwarzenberg, this medium-contrast serif was selected for the Ibero-American Design Biennial. Originally designed for the indigenous language Wayuunaiki, which requires wide glyphs, this free web font features short ascenders and a high x-height, making it particularly legible at small sizes.
12. Gentium Basic
Free web fonts Gentium Basic The free web font Gentium Basic was designed as a multilingual face
Released under the SIL Open Font License, Victor Gaultney’s serif was designed specifically as a multilingual face, incorporating Latin, Cyrillic and Greek scripts and advanced support in the Gentium Plus version. Gentium Basic and Gentium Book Basic are both available as free web fonts, but are restricted to a Latin character set.
13. Open Sans
Free web fonts Open Sans This free web font is crisp, clean and optimized for web and mobile
Designed by Steve Matteson, type director at Ascender Corp, this humanist sans serif boasts great legibility even at small sizes, and has been optimized for both web and mobile interfaces. This free web font has an upright feel, with open letterforms and a neutral-yet-friendly appearance that ensures versatility.
14. Ledger Regular
Free web fonts Ledger Free web font Ledger has excellent legibility even on low-resolution screens
A multi-purpose face with a large x-height, strong stroke contrast, and clearly defined serifs and terminals that all contribute to excellent readability, Denis Masharov’s free web font Ledger is particularly effective for editorial use – working equally well on the printed page or on a low-resolution screen.
Free web fonts Signika The free web font Signika was designed with clarity in mind
In the tradition set by the likes of Meta and Tahoma, Anna Giedry’s designed Signika with signage and wayfinding in mind, where clarity is key. This free web font is a sans serif with low contrast and a tall x-height, qualities that translate well onto screen. Its wide character set includes small caps, pictograms, and arrows.
16. Josefin Slab
Free web fonts Josefin Slab The x-height of this free web font is half its caps height
Win an iPhone 6*
And get the hottest pre-launch news and
rumours, into your inbox, every week
* You agree to be contacted by Future and our trusted third parties.
Competition open to UK residents only. Promo Ts & Cs
Drawing on the trend for 1930s-style geometric typefaces with some added Scandinavian flavour, Santiago Orozco’s distinctive slab serif brings a distinctive ‘typewriter’ feel to its sans serif counterpart, and this free web font is perhaps best suited to display use. Unusually, Josefin’s x-height is half that of its caps height.
Free web fonts Forum This free web font is particularly effective for all-caps headlines
As its name implies, this is a grand Ancient Roman-style serif that is particularly distinctive as a display font used all-caps for headlines, although works stylishly as a sentence-case text face at slightly larger sizes. This free web font’s elegant proportions are reminiscent of classical architecture, with semi-circular arches, horizontal cornices, and vertical columns.
18. Tikal Sans
Free web fonts Tikal Sans This free web font takes its name from the Mayans’ main city
Taking its name from the Mayans’ most prominent city, Tikal Sans’ characterful sharp-ended strokes are influenced by glyphs that were used by the South American civilization. Foundry Latinotype gave this web font a large, contemporary-feeling x-height for both legibility and friendly appeal, while its multiple weights ensure maximum versatility.
Note: currently only medium and medium italic are available free.
Free web fonts Arvo Good arvo, mate! And a very good web font, too…
Equally suited to both print and web, Anton Koovit’s geometric slab serif is available in Roman, Italic, Roman Bold, and Bold Italic. Although this free web font has an almost uniform stroke width, Arvo’s very slight contrast adds to its character – and it’s also carefully hinted to enhance its on-screen readability.
Free web fonts Bevan Ultra-bold web fonts don’t always translate to screens, but this one does
This is Vernon Adams’ reimagining of a traditional 1930s slab serif by Heinrich Jost. The letterforms have been digitised, reshaped and optimised for the web, with more open counters and stronger stems to ensure that Bevan functions as an ultra-bold display font that suits modern browsers.
21. Old Standard TT
Free web fonts Old Standard TT This web font has a very ‘scientific document’ feel to it
Revisiting the Modern (classicist) serif style that was widespread in the late 19th and early 20th century but later abandoned, this style is well suited to giving style and heritage to particular types of content, such as scientific papers, or for setting Greek or Cyrillic type. The name counterbalances the ‘New Standard’ (Obyknovennaya Novaya) used in much Soviet typography.
Free web fonts Kreon This is a personality-packed web font which is great for blogs
Ideally suited to magazine and news websites, as well as blogs, this characterful serif by Julia Petretta has a slight slab feel to it, but its balanced, low-contrast letterforms convey considerably more personality than a more neutral typewriter-style web font might, making it ideal for headlines. Sans serif and italic versions are currently in development.
23. Droid Sans
Free web fonts Droid sans Droid web font is ideal for mobile screens, hence the name
A digital-focused typeface by Ascender Corp’s type director Steve Matteson, Droid Sans has been optimised for maximum readability at small sizes for user interfaces – particularly menus on mobile phone screens (hence the Android-referencing name). It has an upright stress with open letterforms, and balances a neutral feel with a friendly touch.
Free web fonts Italiana This elegant web font adds a touch of class to any site
Another web font geared up for setting newspaper or magazine headlines, which makes it useful for carrying a brand seamlessly across print and digital. Mexico-based designer Santiago Orozco was inspired by traditional Italian calligraphy, and accordingly is well suited to projects that need a touch of elegance and Continental style. Development is ongoing, and Orozco welcomes feedback.
Free web fonts Vollkorn Hardworking web font Vollkorn is its designer’s first attempt as a typeface
Considering it’s Friedrich Althausen’s first attempt at typeface design, this hardworking, multi-purpose serif (the name is German for ‘wholemeal’) is a considerable accomplishment, and has been downloaded thousands of times. Its chunky, well-defined serifs give it confidence and energy that make it equally effective at large sizes for headlines or titles, or for larger passages of text.
Free web fonts Actor The free web font Actor has very distinctive 6 and 9
Like Poly, this free web font emerged from a university project – this time by Thomas Junold while he was studying at Aachen University of Applied Sciences at Karl-Friedrich (Kai) Oetzbach. It has a particularly high x-height that calls for generous line spacing, and also features old-style figures, with 6 and 9 particularly unique.
Free web fonts Lato This free web font is published under the Open Font License
A sans serif family created by Polish designer Łukasz Dziedzic, Lato is published under the open-source Open Font License. Originally developed for a client project, which was later steered in a different direction, the face is relatively non-descript when used small, but reveals its character at larger sizes, where its semi-rounded characters add warmth.
Free web fonts Average Average by name… This web font is neutral and no-nonsense
As its name implies, this typeface by Argentine designer Eduardo Tunni has relatively neutral letterforms in terms of structure and proportion, and comes in both sans serif and serif versions that complement each other nicely. It’s best used as a text font, or for short, no-nonsense headlines.
29. EB Garamond
Free web fonts EB Garamond This variation of the Garamond typeface is a great free web font
Since its roots in the 16th century, the humanist serif face Garamond has become a true typographic icon, and much copied. This particular open-source project by Georg Duffner seeks to bring the essence of Claude Garamond’s masterpiece onto the web. The ‘EB’ stands for Egenolff-Berner, as the web font is based on a specimen created by Conrad Berner while at the Egenolff print office.
Free web fonts Ubuntu Ubuntu is a distinctive web font – and open source, of course
Created by leading London foundry Dalton Maag, this distinctive sans serif font was developed with funding from Canonical Ltd to benefit the wider free software community, and users are encouraged to modify, improve and share the web font. Ubuntu is designed to convey personality on both desktop and mobile screens.
Words: Nick Carson and Sam Hampton-Smith
This is an updated version of an article that previously appeared on Creative Bloq.