This is the documentation for concrete5 version 5.6 and earlier. View Current Documentation

If you don't have a .ttf or .otf file of the font you would like to use, you can download them from

Once you have the font file you would like to use on your website, go to and upload your font file. Once your webfont kit is downloaded, you need to put the files in your directory, and remember the file path to them, because you will need that shortly.

Next, put this code into your css file.

@font-face {
    font-family: 'font-name';
    src: url('../fonts/font-name-webfont.eot');
    src: url('../fonts/lfont-name-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/font-name-webfont.woff2') format('woff2'),
         url('../fonts/font-name-webfont.woff') format('woff'),
         url('../fonts/font-name-webfont.ttf') format('truetype'),
         url('../fonts/font-name.svg#font-name') format('svg');
    font-weight: normal;
    font-style: normal;


And make sure that the file paths in the source is correct.

Next we apply that font to an element.

print("h1: {font-family: 'font-name';}");
Loading Conversation