TF2 HUD Editing Guide

In-Depth: Add a Custom Font

Step by Step guide to installing and using a font in a label, in your HUD.

1.

Pick a Font and get File: There are many great free fonts at DaFont. Pick one, download and extract it. You will need a .tff file or a .otf file (other file types may work, but im sure of these two).

The font I will be using in this example is Bebas Neue.

Note: Be careful when selecting a font. The size and position of many things depend on their font. Changing a font will mean resizing things (maybe a lot of things). So make sure you're happy with a font before using it.

2.

Place the Font File: Open your Custom HUD folder and place the font file in the resource sub-directory.

font file in resource folder
3.

Add to Custom Fonts: Open clientscheme.res from the resource folder, scroll to the bottom to the Custom Fonts section (CustomFontFiles) and add in the font file.

CustomFontFiles
{
   "1" "resource/tf.ttf"
   "2" "resource/tfd.ttf"
   // ...
   "7"
   {
      "font" "resource/BebasNeue.otf"
      "name" "Bebas Neue"
   }
}

The name here must be the name of the font. You can view the name of the font by opening it in windows font viewer.

windows font viewer
4.

Add a Font Instance: Still in the clientscheme.res, scroll up and find the Fonts section. Add an instance of your font. More info on that.

Fonts
{
   "NewFontInstance"
   {
      "1"
      {
        "name"      "Bebas Neue"
        "tall"      "58"
        "weight"   "500"
        "additive"   "0"
        "antialias" "1"
      }
   }
   // ...
5.

Add the New Font Instance to a Resource File: Open the resource file you would like to add the font to, and enter the instance name in the font property of the control you want it on.

hudammoweapons.res > AmmoInClip
"AmmoInClip"
{
   "ControlName"    "CExLabel"
   "fieldName"      "AmmoInClip"
   "font"           "NewFontInstance"
   "fgcolor"        "240 240 240 255"
   "xpos"           "0"
   "ypos"           "0"
   "zpos"           "5"
   "wide"           "102"
   "tall"           "54"
   "visible"        "1"
   "enabled"        "1"
   "textAlignment"  "west"
   "textinsetx"     "10"
   "labelText"      "%Ammo%"
}