The code you're referring to are Unicode characters, font-icon libraries(like fontawesome) use custom codes from the Unicode private use area range.

Icon-font libraries select the codes this range and map them with icon glyphs in their font file, so when you're writing an icon code like this content: "/f1c5"; there's also a font-family: fontawesome; getting applied to it, which shows the character as an icon font in the frontend.

<i class="icon1"></i>
<i class="icon2"></i>

.icon1:before {
    font-family: fontawesome;
    content: "\f000";
}
.icon2:before {
    font-family: someiconfont;
    content: "\f000";
}

It's a quite old property of CSS. You can use it to add some text into somewhere in the web page. Note that, it's only available within :before or :after block. For example, here is CSS:

.username:before { 
  content: "Username: "; 
  font-weight: normal;
  font-style: italic;
 }
.username {
  font-weight: bold;
}

And HTML:

<span class="username">alice</span>

So now, the text "Username: " will display before the input even there is no that text within HTML source code:

https://jsfiddle.net/wyv0m4y4/0

How about the special characters? Sometimes you may want to add the unicode icon instead of pure text. Just use hexa value:

https://jsfiddle.net/wyv0m4y4/1/

Do you see it start with a "\" and then the numbers?

For more hex code:

http://www.ascii.cl/htmlcodes.htm

https://dev.w3.org/html5/html-author/charref