Blog
20 cool fonts for web and graphic design (free + paid)

20 cool fonts for web and graphic design (free + paid)

Check out these 20 cool fonts for your next web or graphic design project.

Blog
Design
20 cool fonts for web and graphic design (free + paid)

20 cool fonts for web and graphic design (free + paid)

Check out these 20 cool fonts for your next web or graphic design project.

Unleash your creativity on the web

Build completely custom, production-ready websites — or ultra-high-fidelity prototypes — without writing a line of code. Only with Webflow.

Get started for free
Get started for free
Written by
Naja Wade

Typography, font, and typeface are focal design elements.

Their aesthetic nature influences people’s perception of a brand, making font all the more necessary for digital designers to consider when designing for the web and beyond.

Font goes the extra mile. It cements a brand’s messaging, aligning a brand to its target audience with each line of header text and subtext within a web design.

Below you’ll find 20 cool fonts worth checking out for personal use or your next web or graphic design project. And don’t worry, we’ve included both free and paid fonts!

1. Graphik (paid)

An image of the Webflow home page.
Webflow uses Graphik

Graphik is a sans-serif typeface celebrated for its contemporary and professional form. It’s inspired by grotesque and geometric sans-serif fonts from the 20th century, which are now gaining popularity in 21st-century design.

Designed by Christian Schwartz, this typeface is featured on a collection of digital and print media, giving sans-serif fonts such as Arial and Lato a run for their money.

The Graphik family has 18 different styles, from bold to regular, compact light, semibold, medium, and so on. Graphik is a gorgeous typeface with a wide range of font styles, each contemporary in its own respect.

2. Recoleta (paid)

An image of Italic's home page.
Italic uses Recoleta for their headings

Recoleta is a bold font with subtle curvaceous elements that convey a Latino-retro aesthetic. You see its Latino hints throughout the lettering in the design of each ligature and glyph — the characters come together boldly and playfully, creating an OpenType font that truly resonates with the viewer.

Designed by Jorge Cisterna and later published by Latinotype, Recoleta’s typeface family contains 15 different styles. Each of which is gorgeous and flirtatious while remaining readable.

3. Neue World (paid)

An image of Loftgarten's home page.
Loftgarten uses Neue World for their heading

Vintage meets vogue is the only way to describe this serif typeface. Neue World encompasses the mode high-fashion aesthetic of the 1960s with a commercial take.

The Neue World serif font family comes in 48 styles and a variable cut, each stunning in their varying widths and weights. Designed by Mathieu Desjardins and published through Pangram Pangram in 2020, this typeface is the new kid on the block. Neue World is one of those fancy fonts that can take a brand to new heights.

4. Editorial New (paid)

An image of Do-Hee's portfolio website.
Do-Hee uses Editorial New

Another serif typeface designed by Mathieu Desjardins is Editorial New. Published through Pangram Pangram in 2019, this typeface is the predecessor of Neue World, and it fully lives up to its namesake.

Editorial New evokes an ’80s and ’90s retro aesthetic with its thin serif styling. Every glyph, ligature, and character is elegantly designed, bringing definition and life to a classic serif type font.

With 16 styles including a delightful take on italics, this font is both charming and elegant — ideal for any editorial medium.

5. Neue Machina (paid)

An image of Career Puppy's home page.
Career Puppy uses Neue Machina

Neue Machina is another typeface designed by Mathieu Desjardins and published through Pangram Pangram. However, unlike the previous two typefaces by Desjardins, Neue Machina is a geometric type with stark curvature and spacing that feels utterly futuristic.

This is a cool font! It’s weighty yet light, with cyberpunk elements emanating from its fun yet mature sci-fi design.

6. Inter (free)

An image of the Norway website.
This Webflow project uses Inter 

Designed by Rasmus Andersson and published through Google Fonts (it’s free!), Inter is a versatile and readable typeface.

With the range in its styles, this is the ideal font for traditional uses, replacing sans-serifs such as Arial. Inter is suitable for whatever the digital medium, be it a web page, iPhone, or Android. Consider Inter your go-to font if you’re searching for a conventional typeface with a bit of oomph!

7. Relative (paid)

An image of the Relume home page.
This Webflow project uses Relative

Relative is an OpenType sans-serif font known for its range. Designed by The Entente in 2011, this type font family comes in two halves: Book to Black (with italics) and faux monospace. This range gives you versatility and readability.

Coming in four weights and 12 styles, Relative is great for both personal and commercial use due to its duality.

8. EB Garamond (free)

An image of the Big Data Girl website home page.
Big Data Girl uses EB Garamond 

If you’re looking for a serif font that is both girly and refined but want to explore typefaces outside of the typical Playfair Display, EB Garamond is the font you’ve been seeking.

Designed by Georg Duffner and published through Google Fonts, this typeface is a beaut. Its classical body and form invoke a timeless feel — truly an ideal rendition of the Garamond font family.

EB Garamond comes in a variety of styles, from regular to medium, italic, semibold, and bold. This humanist font feels fresh yet retains the calligraphy style that made it the preferred typeface since the mid-16th century.

9. Reenie Beanie (free)

Sarah Lupton's website home page.
Sarah Lupton uses Reenie Beanie

A decent handwriting font can be hard to find. They’re often either difficult to read or too juvenile in nature, making what was intended to be cool text a total eyesore.

However, Reenie Beanie proves that handwriting fonts can work if designed effectively. This font is fun and playful. James Grieshaber did wonders in designing a font with a childlike quality and a mature cheekiness that make this font enduring. It is the perfect header text to replace the traditional hero image on a web page.

10. Ogg (paid)

An image of Eun Jeong Yoo's home page.
Eun Jeong Yoo uses Ogg

Ogg is a beautiful typeface — and it knows it. Coming in five weights and 10 different styles, this is the ultimate calligraphy font.

It’s sexy and refined, and each font invokes a mood that varies in weight and style. It has that same high-fashion aesthetic as Neue World, with a bit more variety.

Unleash your creativity on the web

Use Webflow's visual development platform to build completely custom, production-ready websites — or high-fidelity prototypes — without writing a line of code.

Get started for free
Unleash your creativity on the web

Use Webflow's visual development platform to build completely custom, production-ready websites — or high-fidelity prototypes — without writing a line of code.

Get started for free
Get started for free

11. Gulfs Display (paid)

Mack & Pouya uses Gulfs Display

Gulfs Display is a retro pop-inspired candy-like typeface that breathes a new life into the display font family. It is playful and bold, shouting from the rooftops to read this text now!

The lettering simply does something to the eye — it feels like a summer day in 1970s California. Both the lowercase and caps font pull the viewer in, transporting them to designer Cahya Sofyan’s imaginative psyche.

12. Zangezi (paid)

An image of Monograph
Monograph Communications uses Zangezi

Zangezi is a serif font with a disproportionate form that is tight and distinctive. It’s sharp with a curvature that holds the eye and pulls the viewer in.

Designed by Daria Petrova, this typeface is multifaceted. Its varying styles and weights attest to its vast range and communicative capabilities.

13. Space Mono (free)

An image of MDLR's online store.
This Webflow project uses Space Mono

Space Mono is entirely its namesake — a monospaced typeface with geometric and grotesque features.

Available for free download through Google Fonts, this typeface feels like a modern take on the art nouveau movement of the 20th century.

14. Playfair Display (free)

An image of the TheyNomad
ThevNomad uses Playfair Display

Playfair Display is a classic! This serif font has been beloved since its initial publication date — and for good reason. Playfair Display has a true range. It’s feminine and sophisticated.

Designed to feel like a script font with its delicate ligatures, you can see its European Enlightenment origins throughout the display font’s lettering.

15. Fahkwang (free)

An image of a Webflow project using Fahkwang.
This Webflow project uses Fahkwang

Designed by Cadson Demak and available through Google Fonts, Fahkwang is a high-contrast sans-serif typeface inspired by headlines from old Thai newspapers.

This typeface is gorgeous. From a sensual extra-light to a chunky bold, Fahkwang has the reach to invoke a variety of moods and tonalities in the viewer.

16. HWT Arabesque (paid*)

*Free with Adobe Creative Cloud

An image of the Smudgies
Smudgies uses HWT Arabesque

HWT Arabesque is hypnotic. This psychedelic and eccentric typeface encapsulates 1960s Haight-Ashbury with an Arabian Nights twist.

HWT Arabesque is squishy yet sensual. And while it’s only available in one style, this font can truly define a brand’s identity when employed appropriately. Each glyph is all the more enthralling when coupled together to form whatever word desired by its user. And best of all, it’s free if you have Adobe Creative Cloud.

17. Krona One (free)

An image of Joao Sottomayor's portfoluo
João Sottomayor uses Krona One

Krona One is a low-contrast sans-serif typeface designed by Yvonne Schüttler and available through Google Fonts.

While it only comes in one style, this typeface’s midline extended form and curvature showcase Krona One’s personality and its 20th-century Swedish origins.

18. DM Serif Display (free)

A Webflow project using the DM Serif Display font.
This Webflow project uses DM Serif Display

Another member of the serif display family is DM Serif Display. This is a high-contrast transitional face, similar to its sister display font Playfair.

DM Serif Display is available only in two styles through Google Fonts. However, these styles are finely detailed glyphs that can pair wonderfully with just about any sans-serif typeface.

19. Armin Grotesk (free)

An image of a Webflow project using Armin Grotesk.
This Webflow project uses DM Serif Display

Armin Grotesk is another seemingly art nouveau-inspired OpenType typeface with geometric and grotesque features. This typeface is readable and versatile — and it doesn’t lack personality.

When viewed on a web page or mobile device, the text font feels professional yet lighthearted and almost fun.

20. Otto Attack Type (free)

An image of Label Clothing's website.
Label Clothing uses Otto Attack Type

Otto Attack Type is gorgeous. This typeface is hyper-stylized to look cursive but retains its readability. Its lettering extended and wide, loud but elegant, this is the ideal cursive font to add extra visual depth to a web page.

Otto Attack Type is designed by Ivan Tsanko and available for free to download through his Instagram!

Play around with cool fonts in your next web design

So there you have it! Our lineup of 20 cool fonts that can take a brand to new heights. If you’re feeling inspired, go ahead and check out these fonts for yourself by using Webflow!

Related read: Web safe fonts and web fonts, explained


Unleash your creativity on the web

Build completely custom, production-ready websites — or ultra-high-fidelity prototypes — without writing a line of code. Only with Webflow.

Get started for free
Unleash your creativity on the web

Build completely custom, production-ready websites — or ultra-high-fidelity prototypes — without writing a line of code. Only with Webflow.

Get started for free
Get started for free
Last Updated
May 14, 2021
Category
Unleash your creativity on the web

Build completely custom, production-ready websites — or ultra-high-fidelity prototypes — without writing a line of code. Only with Webflow.

Get started for free
Get started for free