Font in Negative Space

Sam
4 min readNov 20, 2018

--

Recently i’ve created a font which uses negative space to create letters. In this article i’ll describe the procedure for creating one.

Following is written using the font i’ve created and if you can’t see the letters , just cover top and bottom of the word and they magically appear. You can download the font at this link

Used a black canvas.

Usage of negative space for a art work or logo gives a mesmerizing experience to audience. first thing first what’s a negative space?

In art, positive-space is the space taken up by a depicted object that’s created and negative space is the canvas without any object on it. Generally many designs focus on positive space or object which is being drawn on canvas and remaining space is just left as it is without any meaning to it. There are lot of pictures that use this left-over space to create another object. if there is meaningful object in both positive and negative spaces, it can create a illusion changing the object on how we look at it like the below

A lamp in negative space and faces in positive (or may be opposite) — source google images

Beside illusions , we can create negative space object to add to meaning of positive space object like below

Negative space is used to create the different colored fur of panda — source google images
Here Negative space is used to create a rider

If we use the Negative space properly with some moving animations, they create wonderful illusions

source google images

Regarding the font i’ve created, it draws meaningless objects on a canvas and shows the words in negative space. This is just taken as a fun project so let’s dive into it.

Overview of process

Main idea is to make a boxes of equal dimension in Photoshop and cut the templates of words into them creating a negative space letters and then create a font out of it.

Template

To choose a template font, i needed something like of square boxes. After surfing on net a bit, i settle on square font (https://www.dafont.com/squarefont.font) as my template for letters.

Steps

There’s a website called calligraphr.com where you can create your own font. I signed up for a free account and in myfont section, there’s a option of new font. This gives you a template for making a font like below

You need to fill out the sections with respective letter and upload it to create a font.

I’ve used Photoshop to draw black boxes in all the sections with same dimensions and wrote the respective letters with square font in each section

Black boxes with letters written in different color using square font

Once that’s completed, i’ve just cut the shape of letter in background and removed the letters.

Final template before uploading to website

i am lazy , so did not create font for small letter and no symbols currently.I uploaded this on calligraphr website and it gave me the final ttf and otf file which i can install in my computer and use later.

Usage

If you’re planning to use this font, download the font(download link) and install it. remember that i only made the font for capital letters, calligraphr website has added basic small letters and symbols, to get negative space letters always use capital letters. spacing is defined by respective software or your settings, so if you space your letters far, they will not create the effect. overlap the letter by decreasing spacing in between them

My name in Negative space font

As of currently, this font has one more problem. Some letters are being placed at different height, I’ve tried aligning them in template multiple times but failed, i am still working on this. To get around this, make each letter a layer so you can adjust height and spacing individually. Once i’ve made the final draft, i’ll update here

Next project

I am currently working on creating something like following ,with no word being fully written

Created only few letters

Pardon me for this extra casual way of writing an article

Thanks for reading the article

--

--