An independent archive of typography.
Topics
Formats
Typefaces

League of Legends game and website

Contributed by Stephen Coles on Jun 23rd, 2019. Artwork published in
circa 2018
.
League of Legends game and website 1
License: All Rights Reserved.

League of Legends is a popular multiplayer online battle arena game. … League of Legends was generally well received upon its release in 2009, and has since grown in popularity, with an active and expansive fanbase. By July 2012, League of Legends was the most played PC game in North America and Europe in terms of the number of hours played.” — Wikipedia

The game’s logo is made with Friz Quadrata, and up until 2015 (when this intro video was released) the typeface was used within the game as well, along with Gill Sans. At some point the game and web designers swapped Friz for Beaufort, a similar inscriptional typeface which was selected as a replacement perhaps because it has a wider range of weights and fewer idiosyncratic and/or distracting features. The accompanying sans is the seldom-seen Spiegel Sans, Lucas de Groot’s humanistic take on American industrial gothics like News Gothic. Both Beaufort and Spiegel are also used throughout the various League of Legends websites, while Colfax joins them for League of Legends Championship Series, a competitive league in which professional players battle in front of audiences.

In-game graphics using Beaufort and Spiegel.
License: All Rights Reserved.

In-game graphics using Beaufort and Spiegel.

League of Legends game and website 3
License: All Rights Reserved.
League of Legends game and website 4
License: All Rights Reserved.
Nick Shinn’s Beaufort was modified by Monotype, expanding the character set and making stylistic adjustments such as the flat-topped ‘3’.
License: All Rights Reserved.

Nick Shinn’s Beaufort was modified by Monotype, expanding the character set and making stylistic adjustments such as the flat-topped ‘3’.

Gill Sans lingers in some of the info panels within the game, while all other type is Beaufort or Spiegel.
License: All Rights Reserved.

Gill Sans lingers in some of the info panels within the game, while all other type is Beaufort or Spiegel.

League of Legends game and website 7
License: All Rights Reserved.
League of Legends game and website 8
License: All Rights Reserved.
League of Legends game and website 9
Source: signup.na.leagueoflegends.com License: All Rights Reserved.
League of Legends game and website 10
Source: nexus.leagueoflegends.com License: All Rights Reserved.
League of Legends game and website 11
Source: universe.leagueoflegends.com License: All Rights Reserved.
League of Legends game and website 12
Source: fanart.na.leagueoflegends.com License: All Rights Reserved.
Beaufort with CSS gradient effects for the headline.
Source: fanart.na.leagueoflegends.com License: All Rights Reserved.

Beaufort with CSS gradient effects for the headline.

Colfax for the team names, scores, standings and schedule of the LoL Championship Series.
Source: watch.lolesports.com License: All Rights Reserved.

Colfax for the team names, scores, standings and schedule of the LoL Championship Series.

League of Legends game and website 15
Source: watch.lolesports.com License: All Rights Reserved.
League of Legends game and website 16
Source: nexus.leagueoflegends.com License: All Rights Reserved.
League of Legends game and website 17
Source: nexus.leagueoflegends.com License: All Rights Reserved.

Typefaces

  • Friz Quadrata
  • Beaufort
  • Spiegel Sans
  • Colfax
  • Gill Sans

Formats

Topics

Designers/Agencies

Artwork location

1 Comment on “League of Legends game and website”

  1. Thank you for the effort, it was quite the effort finding this through Google.

Post a comment