Typofonderie

Today, enjoy several new fonts from Typofonderie — including the celebrated AW Conqueror. Available in inline and chromatic “Carved” styles, as well as slab, serif, and sans, AW Conqueror is a multitalented titling face. We serve it with PostScript-based outlines for smooth rendering on Windows.

AW Conqueror styles
Top to bottom: AW Conqueror Didot, Slab, and alternating Sans/Inline

AW Conqueror Carved is assembled and ready, but some of its chromatic components are also available separately as AW Conqueror Carved One, Two, and Four. Layering chromatic type styles like these is easy, and can produce striking results.

AW Conqueror Carved
Top to bottom: AW Conqueror Carved, Carved Two, Carved Four, and Carved One

In addition, four additional styles of Le Monde Courrier are now available: Book, Book Italic, Extra Demi, and Extra Demi Italic.

Upgrade to a Personal plan or higher to use these Typofonderie faces. If you’re already a paying Typekit customer, well, enjoy the new fonts! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

Freight Micro

Today we’re delighted to welcome Freight Micro to the Typekit library. This third member of Joshua Darden’s Freight superfamily (see also: Freight Sans, Freight Text) from Phil’s Fonts was designed for small sizes in print. On screen, its open, angular forms feel textured and rhythmic at small sizes. For larger headers, its sharp angles appear crisp and dynamic.

Styles of Freight Micro
Top to bottom: Freight Micro Medium, Book Italic, Black Italic, and Light

Freight Micro is available in six weights, each with a matching italic. Its four basic styles (Book, Book Italic, Bold, and Bold Italic) have been manually TrueType hinted to render well at text sizes, and the remaining eight styles are served with PostScript-based outlines for smooth rendering at larger sizes.

Upgrade to a Portfolio plan or higher to use Freight Micro. If you’re already a paying Typekit customer, enjoy the new typeface! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

Monokrom joins Typekit

December 18, 2012

monokrom

Please join us in welcoming Monokrom to Typekit. Just two weeks ago, this new Norwegian foundry by Frode Helland and Sindre Bremnes opened its doors with a small catalog of thoughtfully crafted type — “high quality, original designs with a Nordic touch.” For starters, Faunus, Telefon, and Vinter are available in the Typekit library. These are for use at larger-than-body-text sizes, but are not all display faces.

stack
Top to bottom: Vinter Regular and Italic, Telefon Bold, and Faunus

Each of these Monokrom typefaces is rich in character: Vinter evokes the sweeping chill of Norwegian wintertime; Telefon, the warmth and romance of a bygone visual language; and Faunus, the lively blend of pen, ink, sunlight, and earthy, wooded landscape. The Monokrom site has a page about each design.

Upgrade to a Portfolio plan or higher to use Monokrom fonts. If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

Adobe

Today we’re happy to announce that many more original typefaces from Adobe are available on Typekit — including new optical sizes and styles of legendary typefaces like Arno, Brioso, Adobe Jenson, Kepler, Minion, Sanvito, Utopia, and Warnock, and an array of popular decorative fonts for display use. Browse and filter the entire Adobe catalog on Typekit.

Stacked type specimen featuring new Adobe optical styles
Top to bottom: Kepler Condensed Display, Kepler Extended Display, Brioso Poster, Arno Display, Minion Condensed Display, Minion Black, and Utopia Headline

Stately and elegant, familiar and durable, the Adobe catalog is brimming with typefaces that do their jobs humbly and admirably. With optical styles for display use, subheads, and more, these beautiful typefaces will suit a variety of nuanced purposes — and the Kepler family takes the cake with four optical sizes, four widths, and six weights, for a total of 168 individually drawn styles.

Adobe has already refined the quality in many of its web fonts, and will continue to look for opportunities for improvement in the future. Every font meant for display use is served with PostScript-based outlines for smooth rendering in Windows. Display and Subhead opticals, as well as all decorative fonts, are offered this way.

Stacked type specimen featuring new Adobe display fonts
Top to bottom: Willow Std, Blackoak Std, Postino Std, and Caliban Std

Tasteful novelty fonts can breathe life into a web experience, and the Adobe catalog offers many different, but equally well made, types for exactly that reason.

Select new Adobe fonts are available from our Trial plan, while others require an upgrade to Personal or higher. If you’re already a paying Typekit customer, well, enjoy them all! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

The original version of Trajan is no longer available in the Typekit library. Earlier this year, Adobe Type released Trajan Pro 3 — a new, improved version of Trajan with four additional weights and extended language support. If you were planning to use Trajan in a project, try Trajan Pro 3. You can read more about Trajan Pro 3 in the blog post announcing its arrival at Typekit.

If you already have the retired version of Trajan in a kit, it will continue to work forever unless you remove it from the kit. You can make changes to the kit and republish normally. Trajan will not be automatically removed from existing kits or cease to show up in designs where it is being used. But for newly created kits, only the newer Trajan Pro 3 will be available.

As always, the Typekit team is available to answer questions via support@typekit.com.

Vote for a winner this Election Day — HWT American Chromatic, a set of digital wood type layer fonts made for mixing and matching. And, please welcome the Hamilton Wood Type Foundry to Typekit. Read more about this joint venture between P22 Type Foundry and the Hamilton Wood Type & Printing Museum.

All seven styles of HWT American Chromatic – Solid, Inset, Outline, Stars, Stars Top, Stars Bottom, and the composite Chromatic – were meant for display use, so we serve them with PostScript-based outlines for smooth Windows rendering. Use these fonts big.


HWT American Chromatic in use on our demo page

In his SxSW talk last year, Typekit engineer Sean McBride demonstrated an easy, semantic technique for layering web fonts — jQuery and a few lines of JavaScript keep the markup clean and the CSS simple. Here’s how it works.

<h1 class="chroma vote2">Vote</h1>

First, we’ll mark up some text and give it a class name of “chroma.”

$('.chroma').each(function() {
  $(this).attr('data-content', $(this).text());
});

Then we’ll apply the JavaScript from Sean, that dynamically adds a data-content attribute to any element with the chroma class. For the attribute value, it uses each element’s text content.

.chroma:before,
.chroma:after {
  content: attr(data-content);
  display: block;
  width: 100%;
  }

And in our CSS, we’ll use the element’s JS-generated data-content attribute value as content for :before and :after pseudo elements.

Next, we’ll add some basic styles, using HWT American Outline as a base, and the Solid and Stars Bottom styles for our pseudo elements:


Our h1 element, with :before (above) and :after (below) pseudo elements.

.vote2 {
  font-family: "hwt-american-outline", Georgia, serif;
  color: @gray;
  }
.vote2:before {
  font-family: "hwt-american-solid", Georgia, serif;
  color: @red;
  }
.vote2:after {
  font-family: "hwt-american-stars-bottom", Georgia, serif;
  text-shadow: -1px -1px 0 rgba(0,0,0,0.1);
  color: @red+#555;
  }

Here, I’m using LESS variables for color and I have applied a subtle text shadow to the stars, so they’ll appear to be pressed into the solid style when we stack the layers.

.chroma { position: relative; }
.chroma:before,
.chroma:after {
  content: attr(data-content);
  display: block;
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  }

Finally, we’ll position the pseudo elements absolutely, aligned atop the original (relatively positioned) element. That way, all three styles of HWT American Chromatic overlap.

Study our demo page to see the finished result in action, and to explore a few other ways we’ve mixed and matched styles of HWT American Chromatic. Then try it for yourself. This week, our demo is on CodePen too — you can explore, edit, and fork it.

Upgrade to a Personal plan or higher to use these fonts. If you’re already a paying Typekit customer, well, enjoy the new fonts! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

Fonts.info joins Typekit

November 1, 2012

Today, we are delighted to welcome Fonts.info to Typekit. For starters, we have four display families including the sensational Wayfinding Sans, profiled at I Love Typography earlier this year. In addition, Iwan Reschniev, Logotypia Pro, and Tierra Nueva (Norte and Sur), are all equally well made, but each has a distinctive look. Use all of these typefaces at large sizes — they were drawn for such use, and we serve them with PostScript-based outlines for smooth rendering in Windows.


Wayfinding Sans Bold Condensed, Italic, and Bold Extended

On the web, Wayfinding Sans is best suited for use in display situations, like headings. This is a surprisingly complex and well-balanced family with ten variations overall; its italics, as well as its Condensed and Extended widths, provide subtly different textures and forms.


Iwan Reschniev, Logotypia, Tierra Nueva Norte and Sur

Iwan Reschniev is a modular geometric sans serif in seven weights, and a throwback to Jan Tschichold’s early thinking. Logotypia was “designed for modern logotypes, brands, and headlines,” and has great breadth despite its mere two styles. Tierra Nueva Norte and Sur represent an expressive, deceptively small family worth spelunking.

Upgrade to a Personal plan or higher to use these Fonts.info fonts. If you’re already a paying Typekit customer, enjoy the new fonts! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

Today, Wood Type Revival brings us another digitally remastered rare and historic style of wood type: French Octagon. Use it big! It was designed for signage, and we serve it with PostScript-based outlines for smooth rendering at large sizes on Windows. Read more about French Octagon at Wood Type Revival’s site.

Upgrade to a Personal plan or higher to use French Octagon. If you’re already a paying Typekit customer, well, enjoy the new font! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan whenever you’re ready.

Today, even more Web FontFonts are available to host on Typekit, including FF Atma Serif, FF Cube, FF Eureka Mono, FF Marselis, and FF Meta Correspondence. See the latest FontFont newsletter for details.


FF Atma Serif Medium, Book, and Book Italic

FF Atma Serif is a distinguished, traditional typeface with enough personality for use in headlines and a charming level of detail that brings warmth to text on high-resolution screens. Available in sixteen styles (Book to Black, with italics, plus small caps).


FF Eureka Mono Regular and Condensed Light, FF Fago Monospaced Bold

Each a part of its own extended family, FF Eureka Mono and FF Fago Monospaced have different backgrounds and personalities — Fago is official and blunt, whereas Eureka (available in five weights, plus italics, and matching condensed styles) is nimble and sharp.


FF Cube Condensed Bold Italic, Extra Expanded Bold, and Bold

FF Cube is an industrial sans serif face with a large x-height and geometric forms. It’s great for powerful headlines, and versatile, too; FF Cube is available in three weights and four widths, for a total of 18 styles.

License any of these fonts from FontFont, and host them on Typekit with any of our plans (including our free plan). When you purchase a one-time web license for type families or individual typefaces at FontFont, you’ll receive a link to activate your fonts on Typekit. Then, you can use them just as you would fonts from our subscription library. You can even mix Web FontFonts in the same kits as Typekit library fonts. It’s easy, and all of your fonts stay organized on Typekit in a special “Purchased Fonts” tab. Here’s how it works.


The Purchased Fonts tab organizes fonts you’ve licensed outside of Typekit

Typekit’s subscription library is a solid foundation. But, in Robert Bringhurst’s words, as you “choose your library of faces slowly and well,” remember to think outside the library, too. By bringing fonts to Typekit, as well as finding go-to typefaces we already offer, you can cultivate your own personal type library.

Museo Sans, a perennial Typekit favorite, now comes in a Condensed width. Like its wider predecessor, Museo Sans Condensed is a neutral, steady geometric sans with few frills. Five weights, each with an italic, make this slender style very versatile — and a great addition to projects already using fonts in the Museo superfamily.


Left: Museo Sans Condensed with Museo Slab; Right: Museo Sans Rounded with Museo Sans Condensed and Museo Sans

The 100 and 900 weights of Museo Sans Condensed are served with PostScript-based outlines for smooth rendering at display sizes, while the 300, 500, and 700 weights (plus italics) have been manually TrueType hinted for crisp rendering at small sizes.


Condensed typefaces take up less horizontal space, so they can be set larger.

h2 {
	font: 400 italic 2.5em/1 Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	}
.wf-active h2 {
	font-family: "museo-sans-condensed", sans-serif;
	font-size: 3.375em;
	font-weight: 300;
	}

Finding a fallback for condensed web fonts is a tall order. Be sure to revisit our series of blog posts about font events, which provide conditional hooks (like the .wf-active class, above) for styling elements differently based on the presence of web fonts.

Museo Sans Condensed, like many exljbris fonts, is available to all Typekit users — so, enjoy the new fonts! If you’ve never given Typekit a try, sign up (it’s free!) and upgrade to a paid plan as you need to.