Stately is a symbol font that creates maps of the United States.

Since it’s a font, the maps can be scaled to any size, retaining their sharpness. And they can be easily styled with CSS.

It might seem like an inefficient way to color a map, but the creator, Ben Markowitz, says it’s perfect for some applications.

For one, it’s a much more efficient way to create a series of maps. The designer and some of his coworkers, for example, are currently working on a graphic that shows the recent flu outbreak week-by-week.

"Drawing all 18 graphs was accomplished with a few lines of code, where making each color-coded map individually by hand would be pretty tedious," he says.

Infographic: Font Lets You Make Data Maps Of The U.S., Just By Typing

If you’ve got a keyboard and some data, Stately can handle the visualization.

To make a good infographic, you’ll need a little stats know-how and a little graphic design know-how. Unfortunately, as the format has exploded over the past few years, we’ve seen heaps of work from people who have plenty of the latter but little of the former--beautiful graphics that don’t really tell us much, or, worse yet, obscure the facts. What’s needed is some democratization in the other direction, tools that let people with a good grip on data create visualizations without any proficiency in the Adobe Creative Suite. Chartwell is one such example. Stately makes things simpler yet.

Essentially, it’s a font for creating maps of the United States. A symbol font, to be precise, just like the Word 2000-era favorite Webdings, but instead of planes and pictograms it generates the 50 states--one corresponding to every capital and lowercase letter (lowercase z, not to be left out, summons an image of the entire country). When typed in sequence, the symbols stack up neatly to create a perfect little map. Since it’s a font, it stays crisp at any size. And it can be colored however you want with a few lines of CSS.

The font was created by Ben Markowitz, a UX designer at the DC-based outfit Intridea. Last year, Markowitz started exploring symbol fonts as a means for creating sharp, scalable web elements like buttons and logos. He eventually decided that a font dedicated to making maps would be a worthwhile project, and started working on it in the slice of personal time afforded by his company.

The endeavor began, naturally, on the Eastern seaboard. "In my original proof of concept, I used the original 13 American colonies," he explains. "I was so sure there was going to be something I was missing and they would not line up, but they fit together perfectly." With his Manifest Destiny made plain, the designer worked his way west to the Pacific.

The font may seem like a convoluted way to get something as simple as a color-coded map of the U.S., but Markowitz says it’s incredibly useful for some applications. For one, it’s a much more efficient way to create a series of maps. The designer and some of his coworkers, for example, are currently working on a graphic that shows the recent flu outbreak week by week. "Drawing all 18 graphs was accomplished with a few lines of code, where making each color-coded map individually by hand would be pretty tedious," he says.

Now we just need some international designers to pick up where Markowitz left off. I could use some good maps to learn what’s going on over there with the Eurozone.

Stately is available as a free download. Learn more about the project here.

Add New Comment

5 Comments

  • Reginasan

    Fantastic as-is! Now surely there's an Opentype genius out there who can make the text "us,ca,tx" (or "z,E,r") in one text block show up as a US map with California and Texas colored however each character or pair is colored, the same way typing 33,21,56 in a text box using Chartwell font and glyphs in Indesign creates a pie chart with each value pair a different color in one single text block? Maybe someday expanding into other countries as has been suggested above...depending on which glyph you pull from the Opentype menu?

  • aprecia'doe

    would be ill if this font concept was expanded with multiple "cases" to produce all the continents - starting with South America *hint hint

  • houseofcakes

    How brilliant! This will be really great for orgs that don't have a lot of design support!

  • Grawl

    Looks good, but only as fallback from inline SVG (it means SVG in DOM that you can change with CSS or JS). Try to make Stately fluid.