See more ideas about Comic font, Gig poster and Psychedelic posters. Blambot Comic Fonts and Lettering Hand Lettering Comic Comic Font, Comic Layout,.
For those of us that care about design, Squarespace is pretty great as a platform to create in. A lot of the stuff that takes forever in other platforms is just simply done saving you the headache. As I’ve gotten better with working with Squarespace and my designs bolder, I began to run into a glass ceiling of sorts when it came to typography. Don’t get me wrong the default fonts that Squarespace has built in are great but sometime you just want toadd a little more to your project.
This is where custom fonts come in. You can use them to great effect to create bold, customs looking sites that leave your client/customers marveling.
You can find custom fonts all over the internet, a lot for free, even more payed. Where to find them and how to choose and pair them is the making of a whole other article so for now, I’ll just assume you already have a font you want to use or can search “free Font” on Bechance to find one. For the sake of this guide, I’m going to use a wonderful free font from the brilliant Fabian De Smet. The font is called Butler and is honestly one of the most sexy Serif fonts I’ve ever had the pleasure of working with. The whole 14 weight set can be downloaded for free.
![Custom Custom](http://content.altfonts.com:88/img/B/L/Blambot-Custom.png)
Now that we have the files for the font that we want to add, we have to go put them into squarespace To do this we are going to dabble in the Custom CSS. I know this may sound scary to some of you but fret not, I will tell you everything you need to get this done so even if you have no clue what CSS is or does, you should be able to make it through this section. (Also I’ll try to explain what some of this stuff is to help you if you want to fiddle with it a little bit beyond the scope of this guide.) Firs thing to do from the homepage on the squarespace admin is to click Design → Custom CSS This gets you to the the Custom CSS page but we want to go one step further to make this a little bit easier on ourselves. Click the button that says “ Open in New Window” by doing this you will either get a new tab or a whole new window that is just to play around with CSS.
Their are 5 main parts to the above CSS. @font-face. This is basically how we tell the site to use a custom font. font-family. This is what we call our font. In our case, Butler but this could be whatever you want your font to be called (usually just use its actual name).
Src: url. This is where we put in the URL for the font file that we have already uploaded. Just make sure your curser is inside the “” and click the font file not he right squarespace will then paste the url in for you. Font-weight.
This defines whether on not this is a bold font. We will use this in a bit to make a different version of the font so that when we click bold in the default squarespace text editor, there is a heavier font for the system to recognize. Font-style. This determine between regular and italic fonts.
We are actually going to hack this to create astencil version of our font (more on that in the next ste Go ahead and modify the stock code above so that it matches the final code Below (note your URL will be different, just make sure it is the file for butlerregular).