8 Beautiful Neon Fonts and Effects

8 Beautiful Neon Fonts and Effects

Neon fonts and styles are making a comeback in 2017

Neon signs and their unique stylistic features have been for decades: what we've come to know and love as neon style in 2017 was born of the necessity to carefully bend glass tubes into letters in a way that allowed their internal neon gas to be electrified and illuminated. Nowadays, this same retro-inspired style is making for beautiful and authentic digital graphics that can inspire a hipster/80s vibe unlike any other.

Neon Fonts

A good neon font is the basis for almost all work in neon-styled design and a lot of work in real-world signage as well. We've looked at a bunch of different fonts and picked a few of our favorites to get you started.

Las Enter — Neon Script

Las Enter Script

Our first neon font is called Las Enter and is designed by Mans Greback out of Sweden. Free for personal use and 29 Euro for commercial license, you find out more here.

Mexcellent — Trilinear Display Font

Mexcellent Font

Designed by Typodermic Fonts, Mexcellent is a very interesting neon-esque font that is very suitable for display purposes. Check it out and download more here: http://typodermicfonts.com/mex...

Neon Lights — Rounded 3D Font

Neon Lights Font

Neon Lights is a very interesting font designed by Allen R. Walden. Free for both personal and commercial use, this font has a beautifully subtle 3D effect built in in the shape of smaller strokes inside each glyph. Check it out and download for yourself here: http://www.fontspace.com/allen-r-wald...

Neon Tubes Font — Classic Neon Style

Neon Sign Font

This list wouldn't be complete without the Neon Tubes Font designed by Medialoot's very own Tony Thomas. This font is a classic neon font with rounded letterforms and a real world tube-style. If you're looking for a realisitc sign effect or need your font to have accurate tubes, this is the way to go. Download the Neon Sign Font here →


Neon Effects

If you've already got your vectors, shapes, or outlines and you're just looking to add an effect to something the following effects and tutorials are going to be a huge help. With different styles, techniques, and authors, one of these is bound to have something useful in your quest for the perfect fit.

CSS-Only Neon Glow Effect

This neon effect was created by our very own Mason Hipp and uses the Neon Tubes font from above. Nothing but layered CSS text-shadows, the effect is extremely flexible and easy to implement. Check out the details and CSS on codepen

See the Pen Neon Text Effect (CSS Only) by Glyphs Company (@glyphs) on CodePen.


Realistic Neon in Adobe Photoshop

An awesome youtube tutorial for creating realistic neon lighting effects. Check it out and try it for yourself:


Neon Effect in Photoshop (non-video)

Photoshop Neon Effect

For those of you who would prefer to read a tutorial rather than watch a video, this effect is easy to follow and has a wonderful result. Read the full tutorial on Abduzeedo here.

Extremely Realistic Neon Effect

Neon Effect Type

For those of you who would rather purchase a neon effect than follow through the tutorials above, we have this incredibly realistic neon effect available on Medialoot for purchase at $10. The effect was designed by Tony Thomas and is a great pairing with the Neon Tubes font above. Check it out here ->

Bonus: Free Neon Effect Download

free neon text effect

As a little bonus if you've made it this far, we're including a link to a free PSD file with a neon text effect. If you're in a hurry and you don't want to pay for a premium effect, try downloading this freebie and take it from there. Get the free download here

And that's it for the beautiful neon effects! If you've got any recommendations or questions feel free to mention in the comments — we'd love to hear from you!


Comments

Sign up to our Newsletter

Get site updates, freebies, and MediaLoot news.

Contact Us

Suggest a resource

FAQ

See all
X

You've successfully logged in!