This is a preview of the typeface. Check out the whole set here!
Each letter is drawn with only one line to mimic the real neon signs.
Some examples of the typeface being used in actual neon signs. This is also achieved with only code. Check out the coded version here!
To achieve this interactive experience, I used HTML, CSS and jQuery.
Here I'm using the letter "A" as an example showing the code behind this project.
HTML: It consists of 5 layers: the fill, outline, shadow and glows.
CSS: The CSS consists of various animations that mimic the neon effects and can be triggered by the keyboard interaction.
jQuery: jQuery enables the user to interact with the letters by pressing on the keyboard, which triggers the animations.