{"id":42324,"date":"2017-01-11T05:00:23","date_gmt":"2017-01-11T13:00:23","guid":{"rendered":"https:\/\/creativemarket.com\/blog\/?p=42324"},"modified":"2024-04-14T23:50:03","modified_gmt":"2024-04-15T06:50:03","slug":"100-web-typography-examples","status":"publish","type":"post","link":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples","title":{"rendered":"100 Brilliant Web Typography Examples"},"content":{"rendered":"

Typography is one of the most underappreciated parts of design, which is ironic. I mean designers need to understand the ins and outs of good typography to choose the correct fonts for brochures, flyers, business cards…and especially web fonts.\nYou need to consider factors like readability, legibility, contrast, serif or sans serif—and the list goes on and on. The font you choose has to complement your overall design in an aesthetically pleasing way, whether that’s on the web or in print.\nThe best way, for my money, to get familiar with what typeface works and what doesn’t is to simply study great examples of web typography.\n

<\/span>Kickstarter<\/span><\/h2>

\nThis well-known crowd-funding website sports bubble letters! Its wordmark is spelled out in glorious bubble letters in the header of the homepage. That takes us right back to childhood.\n\"kickstarter\"\n<\/p>

<\/span>Upwork<\/span><\/h2>

\nFind-me-a-freelancer site Upwork uses gorgeus sans serif typeface in its value proposition. The simple cleanliness of this typeface and the fat stems of the individual fonts make it pop.\n\"upwork\"\n<\/p>

<\/span>Ask.fm<\/span><\/h2>

\nThis social network built on the premise of Q&As features a combination of bubble letters and slanted typography that’s instantly memorable. The white-on-blue contrast is perfect to help it stand out.\n\"ask-fm\"\n<\/p>

<\/span>The Wall Street Journal<\/span><\/h2>

\nThis highly regarded publication goes the serif route with its all-uppercase title\/header. Creating a classic and old-school feel, this typeface makes sense for a traditional newspaper.\n\"wsj\"\n<\/p>

<\/span>Scribol<\/span><\/h2>

\nThis listicle and strange-news site uses a combination of Stag Web and Helvetica Neue fonts for a look that’s clean and super-readable. Note the beautiful spacing the words for extra legibility.\n\"scribol\"\n<\/p>

<\/span>The Telegraph<\/span><\/h2>

\nThis highly trafficked British news site sports a very ornate and almost medieval-inspired typeface, but it’s really Austin News Text Semibold. It gives the homepage a touch of grandeur.\n\"telegraph\"\n<\/p>

<\/span>Autopilot Technology<\/span><\/h2>

\nNoto Sans JP is the star of the show on the Japanese tech company’s site. Its strong, bold and determined sans serif fonts contrast well with the futuristic-looking background.\n\"autopilot-technology\"\n<\/p>

<\/span>League of Legends<\/span><\/h2>

\nThis computer game’s site features imposing, bold typeface for its logo. Plus, the fonts for the headline and description provide a sense of balance due to their minimalism.\n\"league-of-legends\"\n<\/p>

<\/span>Zendesk<\/span><\/h2>

\nThis customer-service software company’s homepage features magnificent, ultra-simple and understated fonts—that clearly communicate the unique value proposition of this business.\n\"zendesk\"\n<\/p>

<\/span>Fiverr<\/span><\/h2>

\nFiverr’s site displays fatter serif typeface that’s highly stylized as well. This mix of blatancy and readability creates a memorable visual that makes an impression.\n\"fiverr\"\n<\/p>

<\/span>Falter Inferno<\/span><\/h2>

\nWith bolded strokes, stems, stresses and bowls, the typeface for Falter Inferno is aesthetically appealing and memorable. Its neutral colors also make it evocative.\n\"falter-inferno\"\n<\/p>

<\/span>Spiegel Online<\/span><\/h2>

\nThis famous German publication boasts its own Spiegel Sans Web font that features alternating fatter and thinner stems and strokes in the individual characters. The result is one that commands attention.\n\"spiegel\"\n<\/p>

<\/span>Kohl’s<\/span><\/h2>

\nThe handwritten font on Kohl’s homepage—for a banner declaring there’s still time for last-minute Christmas gifts—is a superb example of a stylized and festive typeface.\n\"kohls\"\n<\/p>

<\/span>GSMArena<\/span><\/h2>

\nGSMArena’s wordmark features very stylized and unique typography. Note the use of both uppercase and lowercase characters, as well as the stylized “A.â€\n\"gsmarena\"\n<\/p>

<\/span>Possession Begins<\/span><\/h2>

\nThe typography for this horror site is doubly effective: Blood-red\/dripping font in the headline and then a stylized effect in the subheadline.\n\"possession\"\n<\/p>

<\/span>The Boat<\/span><\/h2>

\nNote the very striking and dramatic typeface of “The Boat.†The choice of font is perfect for the stormy-seas motive of this storytelling site, as it really pulls site visitors in immediately.\n\"the-boat\"\n<\/p>

<\/span>Wix<\/span><\/h2>

\nWix, the free site-building platform, uses simple-though-effective sans serif font. Against a light-blue background, the contrast makes this typeface pop all the more effectively.\n\"wix\"\n<\/p>

<\/span>Battle.net<\/span><\/h2>

\nAn online gaming community, Battle.net features header typeface that’s sleek, sharp and nicely stylized. The logo next to the typeface adds to its effectiveness.\n\"battle-net\"\n<\/p>

<\/span>Le Dernier Gaulois<\/span><\/h2>

\nThis French site features extremely memorable and evocative Playfair Display font that ties together the whole design and appearance of the site.\n\"le-dernier-gaulois\"\n<\/p>

<\/span>Clouds Over Cuba<\/span><\/h2>

\nA retrospective about the Cuban Missile Crisis, this site features elegant serif fonts that capture the drama of this highly intense moment in American history.\n\"clouds-over-cuba\"\n<\/p>

<\/span>Make Me Pulse 2016<\/span><\/h2>

\nTalk about a highly stylized typeface. The font for Make Me Pulse 2016’s font is absolutely imaginative, to say the least. Its minimalist colors further elevate its presentation.\n\"make-me-pulse-2016\"\n<\/p>

<\/span>Life Buzz<\/span><\/h2>

\nInspiring-stories site Life Buzz features an interesting take on its wordmark logo. Its all-uppercase design with parentheses thrown in for good measure is eye-catching.\n\"life-buzz\"\n<\/p>

<\/span>Macy’s<\/span><\/h2>

\nMacy’s festive “Merry Christmas†font stands out with its classic and handwritten approach to typography. The slanted cursive conveys a sense of personal touch.\n\"macys\"\n<\/p>

<\/span>USPS<\/span><\/h2>

\nThe U.S. Postal Service’s homepage shows off a unique font in the wordmark logo. Slanted and sans serif, its all-uppercase design communicates authority.\n\"usps\"\n<\/p>

<\/span>MIT<\/span><\/h2>

\nThe Massachusetts Institute of Technology’s site displays an almost stencil-like typeface that’s really just a bunch of rectangles joined together to form the MIT acronym.\n\"mit\"\n<\/p>

<\/span>Peugeot Catch the Dragon<\/span><\/h2>

\nPeugeot’s Catch the Dragon site showcases bold, striking and unafraid typography that’s all at once confrontational and exciting.\n\"catch-the-dragon\"\n<\/p>

<\/span>The Happy Forecast<\/span><\/h2>

\nThis site’s typography is so unreal that it’s basically “out there.†With trippy font that’s made out of different geometric shapes, it invites visitors to study it like some art exhibition.\n\"happy-forecast\"\n<\/p>

<\/span>The Law of the Jungle<\/span><\/h2>

\nThis site for last year’s “The Jungle Book†remake shows what you can do when you use evocative typeface. The font perfectly captures the wildness and mystique of the movie.\n\"the-law-of-the-jungle\"\n<\/p>

<\/span>Samsung<\/span><\/h2>

\nSamsung’s site features simple, bold and thick sans serif typography to alert visitors to the urgency of getting that great gift—before Christmas is over.\n\"samsung\"\n<\/p>

<\/span>Asos<\/span><\/h2>

\nAsos features ultra-basic font that’s so simple that it’s almost unassuming, but this creates a perfectly readable contrast with the background.\n\"asos\"\n<\/p>

<\/span>Poptm<\/span><\/h2>

\nCreativity rules in the typeface of this popover and popunder site: The alternating black-and-white backgrounds make the simplicity of the sans serif font more striking.\n\"poptm\"\n<\/p>

<\/span>Dictionary.com<\/span><\/h2>

\nThe use of Verdana for its defined words provides Dictionary.com with a font that’s well-suited for readers trying to learn spelling and pronunciation.\n\"dictionary\"\n<\/p>

<\/span>Utorrent<\/span><\/h2>

\nThis downloading client’s homepage makes use of elegant and airy fonts that are just as elegant as its downloading prowess.\n\"utorrent\"\n<\/p>

<\/span>Freepik<\/span><\/h2>

\nWhat makes the typeface of this site so interesting is the subtle nod to 3D in the form of drop shadows, which you can see (if you look closely enough) under each letter.\n\"freepik\"\n<\/p>

<\/span>Taboola<\/span><\/h2>

\nNote the highly unique, stylized wordmark logo of this company, in the header of the site. What makes this content-delivery network’s logo so memorable is the resemblance to a pair of smiling eyes.\n\"taboola\"\n<\/p>

<\/span>UPS<\/span><\/h2>

\nWith its very basic, sans serif typography, the UPS wordmark is dedicated to pure minimalism. The all-lowercase characters are a further, neat touch.\n\"ups\"\n<\/p>

<\/span>Instructure<\/span><\/h2>

\nThis software company’s homepage displays some exceptionally neat fonts: Pencil-thin sans serifs as part of a bigger formula that ties into its value proposition.\n\"instructure\"\n<\/p>

<\/span>House of Borel<\/span><\/h2>

\nHouse of Borel’s typography is very mysterious and minimalist: Just a white-on-black presentation to make a noticeable impact.\n\"house-of-borel\"\n<\/p>

<\/span>Train Robber<\/span><\/h2>

\nTrain Robber’s typeface makes us long for a western. With stylized protrusions on the sides of the individual fonts, Train Robber’s typeface is evocative.\n\"train-robber\"\n<\/p>

<\/span>Future Living<\/span><\/h2>

\nAlmost childlike typography is the star on Future Living’s site. Its relaxed, elementary and all-uppercase design reminds us of grade school all over again.\n\"future-living\"\n<\/p>

<\/span>Bolden<\/span><\/h2>

\nAlmost too hard to read for entirely artistic reasons, this design and development firm’s homepage typography is literally comprised of layered fonts on top of each other.\n\"bolden\"\n<\/p>

<\/span>Breitbart<\/span><\/h2>

\nThis political site’s rough and raw font creates a thought-provoking, weathered look that complements the wooden-themed background nicely.\n\"breitbart\"\n<\/p>

<\/span>McWhopper<\/span><\/h2>

\nWhen you want a font that grabs visitors’ attention, go with something rare, like Block Berthold Condensed. McWhopper uses this font to great effect on its homepage.\n\"mcwhopper\"\n<\/p>

<\/span>Vangarde Music<\/span><\/h2>

\nThis small music label’s site features notably stylized typography and flat fonts that also help in branding this company. Overall, a neat and professional representation.\n\"vangarde-music\"\n<\/p>

<\/span>Melanie F<\/span><\/h2>

\nMelanie F’s lookbook site gives visitors an opportunity to admire the beautiful, slanted font that easily draws the eye with its color contrast and fanciness.\n\"melanie-f\"\n<\/p>

<\/span>The New Yorker<\/span><\/h2>

\nThis long standing publication’s site demonstrates what elegant and timeless typography can be if it’s done excellently. This font combines serifs and sans serifs in a memorable medley.\n\"the-new-yorker\"\n<\/p>

<\/span>Quanta Group<\/span><\/h2>

\nHandsome serif fonts make a strong case here for the power of ornamentation in typography. The Quanta Group’s site offers a very readable value proposition.\n\"quanta-group\"\n<\/p>

<\/span>Shutterstock<\/span><\/h2>

\nShutterstock uses typeface that displays a minimalist, sans serif look, thus making it super-easy for visitors to read the info at a glance.\n\"shutterstock\"\n<\/p>

<\/span>Fox News<\/span><\/h2>

\nThis news site’s typography is reminiscent of the searchlights in 20th<\/sup> Century Fox, with its very fat and thick stems, strokes and stresses.\n\"fox-news\"\n<\/p>

<\/span>Scribd<\/span><\/h2>

\nNotice right away the refined and gorgeous typeface that offers more than adequate spacing between each character for super-easy reading, a luxury in today’s slew of different typefaces.\n\"scribd\"\n<\/p>

<\/span>The Anonymous Hamburger<\/span><\/h2>

\nWith its powerfully bold and serif typeface, The Anonymous Hamburger epitomizes stunning typography. The simplicity of using a black-on-white color scheme only adds to the drama.\n\"the-anonymous-hamburger\"\n<\/p>

<\/span>Calendas Plus<\/span><\/h2>

\nThis font site showcases gorgeous, cursive type that is as classic as it is modern. With its serifs and elaborate ornamentation, this type makes quite the impression.\n\"calendas-plus\"\n<\/p>

<\/span>Standard Films<\/span><\/h2>

\nThis typeface puts the drama into dramatic. Its faded, golden-to-rusty color and the dark, black background are the perfect combo for a memorable font.\n\"standard-films\"\n<\/p>

<\/span>Gestrandete Wale<\/span><\/h2>

\nA German site with a conservationist message, Gestrandete Wale features fat, bold and minimalist fonts along with some serif ones, which excel at getting the message across clearly.\n\"gestrandete-wale\"\n<\/p>

<\/span>Panache<\/span><\/h2>

\nThe use of very thin and fine characters creates a very refined look for this font. Together with a few stylized elements, Panache exudes charm.\n\"panache\"\n<\/p>

<\/span>B & O Play<\/span><\/h2>

\nThis ecommerce site for audio gear uses extremely thin sans serifs that speak to the high quality of the headphones that are available.\n\"b-o-play\"\n<\/p>

<\/span>Cappen<\/span><\/h2>

\nWide stems and stresses unite with striking sans serif characters to create a very minimalist but effective typeface. It’s short and to the point.\n\"cappen\"\n<\/p>

<\/span>Liputan 6<\/span><\/h2>

\nThis foreign news site’s workmark logo melds letters with number for a distinctive look.\n\"liputan-6\"\n<\/p>

<\/span>Wed’ze<\/span><\/h2>

\nPerhaps matching the rugged, outdoorsy vibe of the site, Wed’ze’s typography screams on-the-edge and wild, which indicates smart branding choices.\n\"wedze\"\n<\/p>

<\/span>Naver<\/span><\/h2>

\nThis Japanese retailer features deceptively elementary typography that seems almost childlike in its simplicity, but is actually very readable and so helpful.\n\"naver-jp\"\n<\/p>

<\/span>SourceForge<\/span><\/h2>

\nSourceForge’s font is best described as utilitarian meets stylized. The hard and sharp edges are refreshing in today’s aesthetic-obsessed design world.\n\"sourceforge\"\n<\/p>

<\/span>Rester Avec Toi<\/span><\/h2>

\nThis site features fonts with aesthetic color contrast that works to create an outline for every character. The end result is something basic, but attractive.\n\"rester-avec-toi\"\n<\/p>

<\/span>Sirin Labs<\/span><\/h2>

\nSimplicity rules the day at Sirin Labs, with the bold, sans serif typeface that’s used for extreme readability, clarity and overall legibility.\n\"sirin-labs\"\n<\/p>

<\/span>Slack<\/span><\/h2>

\nThe world-famous messaging app for great team communication relies on minimalist, sans serif fonts with spacious tracking for extra clarity and readability.\n\"slack\"\n<\/p>

<\/span>Locus Solus<\/span><\/h2>

\nWords like sleek, elegant and sublime are all words that come to mind when you gaze at this font. That’s because its all-uppercase font and roomy tracking give off a luxurious quality.\n\"locus-solus\"\n<\/p>

<\/span>Five Minutes<\/span><\/h2>

\nThis site’s homepage features typography that’s part of a logo design, which always makes fonts so much more interesting.\n\"five-minutes\"\n<\/p>

<\/span>Protest<\/span><\/h2>

\nThis outdoor outfitter site’s fonts double down on accessible and open, showcasing fonts that are easy to read and inviting, which is perfect from an ecommerce standpoint.\n\"protest\"\n<\/p>

<\/span>Forbes<\/span><\/h2>

\nWith its close tracking, but wide stresses, stems and bowls, Forbes demonstrates some very readable and aesthetically pleasing typography in its navigation menu.\n\"forbes\"\n<\/p>

<\/span>Trello<\/span><\/h2>

\nTrello’s wordmark logo is a great study in typography: Note its cursive, slanted style that still makes for easy reading, mainly due to its intelligent tracking.\n\"trello\"\n<\/p>

<\/span>Weebly<\/span><\/h2>

\nWeebly’s homepage tagline is written in a font that almost resembles having been applied with a paint brush; this stylistic nuance makes it very aesthetic.\n\"weebly\"\n<\/p>

<\/span>Weather.com<\/span><\/h2>

\nWeather.coms’ typography is very interesting because of its clean, almost understated presentation. This is obvious in both the letters and the degree numbers.\n\"weather-com\"\n<\/p>

<\/span>Camden Town Brewery<\/span><\/h2>

\nCamden Town Brewery’s typeface is strikingly bold: Clean, clear-cut and very neat. Fat characters and generous tracking add to the appeal of the typeface.\n\"camden-town-brewery\"\n<\/p>

<\/span>Cantina Dei Colli Ripani<\/span><\/h2>

\nThis wine-selling ecommerce shop relies on GaramondPro font to create an attractive, visual presentation that shows the potential of serif fonts.\n\"cantina-dei-colli-ripani\"\n<\/p>

<\/span>Christmas Express<\/span><\/h2>

\nA festive site, this celebration of Christmas uses some exceptionally aesthetic fonts that are heavily stylized with Christmas symbols and themes.\n\"christmas-express\"\n<\/p>

<\/span>Siemen’s Santa’s Factory<\/span><\/h2>

\nSiemen’s Santa’s Factory site boasts some amazing typography that’s perfect for Christmas. Note the whimsical, wispy font and the old-school motif.\n\"santas-factory\"\n<\/p>

<\/span>Big Youth<\/span><\/h2>

\nWith its vibrant, bold, blue colors, the typography for Big Youth is truly unique: It looks like bubble letters and cursive, but it’s really not either…\n\"big-youth\"\n<\/p>

<\/span>Cuberto<\/span><\/h2>

\nThis digital agency’s choice of font is a good indicator of its creativity: Serif typeface that’s at once readable and visually pleasing.\n\"cuberto\"\n<\/p>

<\/span>Perturbator<\/span><\/h2>

\nPerturbator’s typography is definitely 80s-inspired, retro gloriousness…all wrapped up in a neat, handwritten font that’s not that readable, but definitely memorable.\n\"perturbator\"\n<\/p>

<\/span>Studio Details<\/span><\/h2>

\nThis Japanese company features utterly minimalist typography that gets the job done: Sans serif fonts with a bit of stylization for maximum effect.\n\"studio-details\"\n<\/p>

<\/span>Up to Tab<\/span><\/h2>

\nThis site’s typography is the epitome of cartoony and non-serious, but when you look a bit closer, you’ll see solid typography techniques like clarity, tracking, colors and legibility.\n\"up-to-tab\"\n<\/p>

<\/span>Cienne New York<\/span><\/h2>

\nWith easily readable, clean font design, Cienne New York’s typography is pleasing to the eye and attractive. It’s excellent for an ecommerce store that needs to persuade to sell.\n\"cienne-new-york\"\n<\/p>

<\/span>Audiko<\/span><\/h2>

\nThis free-ringtones site uses slanted serif typeface to create a 404 error page that’s very memorable for anyone who should stumble upon it.\n\"audiko\"\n<\/p>

<\/span>Roblox<\/span><\/h2>

\nGame site Roblox makes a unique contribution to typography by showcasing a font that’s very childish, but ultimately consistent with the fun vibe of the site.\n\"roblox\"\n<\/p>

<\/span>Blue Egg<\/span><\/h2>

\nDigital branding agency Blue Egg draws positive attention by using an all-lowercase font that’s entirely handwritten and features no tracking at all.\n\"blue-egg\"\n<\/p>

<\/span>Mozilla<\/span><\/h2>

\nMozilla’s value proposition is written on a slant without being cursive, with sans serif typeface and bold characters for a readable and appealing look.\n\"mozilla\"\n<\/p>

<\/span>The Washington Post<\/span><\/h2>

\nThis old newspaper’s site features, unsurprisingly, very old-school typography that works very nicely for its publishing\/newsy vibe.\n\"washington-post\"\n<\/p>

<\/span>Lucy Hardcastle – The Fifth Sense<\/span><\/h2>

\nAlmost dreamlike in its typography, this site showcases what fonts would look like if we could see and experience them…underwater. An ultra-interesting effect is offered.\n\"lucy-hardcastle-the-fifth-sense\"\n<\/p>

<\/span>Converse “Diamondsâ€<\/span><\/h2>

\nShoeseller Converse tries something different with this site and displays a remarkable typeface that’s graffiti font-inspired and showcases a lot of personality.\n\"converse\"\n<\/p>

<\/span>Nissan Kicks View<\/span><\/h2>

\nNissan’s homage to the Rio Olympics, this site features all-caps typeface with some very interesting characters. The hefty space between the letters adds to readability.\n\"nissan-kicks-view\"\n<\/p>

<\/span>Pomerleau<\/span><\/h2>

\nThis building-experts site uses bold and heavyset typography to make the point that its construction and design are strong, sturdy and reliable.\n\"pomerleau\"\n<\/p>

<\/span>Sequence<\/span><\/h2>

\nSequence utilizes a sans serif font that’s extremely legible, clear and smart. What better way to make the point that it’s a creative agency that gets design and branding?\n\"sequence\"\n<\/p>

<\/span>Xavier Bourdil<\/span><\/h2>

\nGraphic designer Xavier Bourdil’s About section uses Freight big typeface, which is characterized by elegant and thin serifs, tall cap heights, and great tracking for clarity.\n\"xavier-bourdil\"\n<\/p>

<\/span>Outbrain<\/span><\/h2>

\nOutbrain’s wordmark logo is an interesting take on a stylized typeface. Note the use of the person with glasses in the “O†of the wordmark.\n\"outbrain\"\n<\/p>

<\/span>India Times<\/span><\/h2>

\nA site of few characters, its homepage features India Times’ sparse wordmark, which is really just the acronym “IT.†However, its lowercase slanting action is more than enough to be memorable.\n\"india-times\"\n<\/p>

<\/span>Adam Underwear<\/span><\/h2>

\nKudos to this site for using sans serif fonts that are bolded and normal on the same product page. The juxtaposition creates a visually appealing typeface design.\n\"adam-underwear\"\n<\/p>

<\/span>Frederique Constant<\/span><\/h2>

\nThis watchmaker’s site uses serif fonts that have an almost classical feel—you could picture this typeface on an old Greek or Roman building.\n\"frederique-constant\"\n<\/p>

<\/span>Tio Luchin<\/span><\/h2>

\nWith a smart and spiffy handwritten typeface, Tio Luchin’s site typography gives off personality and character in droves.\n\"tio-luchin\"\n<\/p>

<\/span>Indian Type Foundry<\/span><\/h2>

\nUnsurprisingly, this design shop for fonts sports amazing-looking typeface right on its homepage. Its neutral color scheme helps the refined and dignified serifs stand out with purpose.\n\"indian-type-foundry\"\n<\/p>

<\/span>Indeed<\/span><\/h2>

\nLowercase bubble letters and a slightly stylized design over the “i†make for an eye-catching wordmark. Each character is extremely legible in spite of the design.\n\"indeed\"\n<\/p>

<\/span>Daily Mail<\/span><\/h2>

\nThis British newspaper’s site features a stimulating typeface combination: Very old-school fonts and very modern, slimline sans serif fonts for a commanding wordmark.\n\"mail-online\"\n<\/p>

Products Seen In This Post:<\/strong><\/p>

<\/figure>\n \n
<\/figure>\n \n<\/p><\/p>\n","protected":false},"excerpt":{"rendered":"

Typography is one of the most underappreciated parts of design, which is ironic. I mean designers need to understand the ins and outs of good typography to choose the correct fonts for brochures, flyers, business cards…and especially web fonts. You need to consider factors like readability, legibility, contrast, serif or sans serif—and the list goes […]<\/p>\n","protected":false},"author":144,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[34],"tags":[37,166],"topics":[],"class_list":["post-42324","post","type-post","status-publish","format-standard","hentry","category-creative-inspiration","tag-typography","tag-fonts"],"acf":[],"yoast_head":"\n100 Brilliant Web Typography Examples - Creative Market Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/creativemarket.com\/blog\/100-web-typography-examples\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"100 Brilliant Web Typography Examples\" \/>\n<meta property=\"og:description\" content=\"Typography is one of the most underappreciated parts of design, which is ironic. I mean designers need to understand the ins and outs of good typography\" \/>\n<meta property=\"og:url\" content=\"https:\/\/creativemarket.com\/blog\/100-web-typography-examples\" \/>\n<meta property=\"og:site_name\" content=\"Creative Market Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/crtvmrkt\" \/>\n<meta property=\"article:published_time\" content=\"2017-01-11T13:00:23+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-15T06:50:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2017\/01\/14234528\/Kickstarter.jpg.webp\" \/>\n<meta name=\"author\" content=\"Marc Schenker\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@creativemarket\" \/>\n<meta name=\"twitter:site\" content=\"@creativemarket\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Marc Schenker\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"16 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples\",\"url\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples\",\"name\":\"100 Brilliant Web Typography Examples - Creative Market Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2017\\\/01\\\/14234528\\\/Kickstarter.jpg.webp\",\"datePublished\":\"2017-01-11T13:00:23+00:00\",\"dateModified\":\"2024-04-15T06:50:03+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#\\\/schema\\\/person\\\/b1e20fb9aeef6b45762dbab55e31c7c8\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples#primaryimage\",\"url\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2017\\\/01\\\/14234528\\\/Kickstarter.jpg.webp\",\"contentUrl\":\"https:\\\/\\\/d3ui957tjb5bqd.cloudfront.net\\\/uploads\\\/2017\\\/01\\\/14234528\\\/Kickstarter.jpg.webp\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/100-web-typography-examples#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"100 Brilliant Web Typography Examples\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/\",\"name\":\"Creative Market Blog\",\"description\":\"Creative Market Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/creativemarket.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"100 Brilliant Web Typography Examples - Creative Market Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples","og_locale":"en_US","og_type":"article","og_title":"100 Brilliant Web Typography Examples","og_description":"Typography is one of the most underappreciated parts of design, which is ironic. I mean designers need to understand the ins and outs of good typography","og_url":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples","og_site_name":"Creative Market Blog","article_publisher":"https:\/\/www.facebook.com\/crtvmrkt","article_published_time":"2017-01-11T13:00:23+00:00","article_modified_time":"2024-04-15T06:50:03+00:00","og_image":[{"url":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2017\/01\/14234528\/Kickstarter.jpg.webp","type":"","width":"","height":""}],"author":"Marc Schenker","twitter_card":"summary_large_image","twitter_creator":"@creativemarket","twitter_site":"@creativemarket","twitter_misc":{"Written by":"Marc Schenker","Est. reading time":"16 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples","url":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples","name":"100 Brilliant Web Typography Examples - Creative Market Blog","isPartOf":{"@id":"https:\/\/creativemarket.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples#primaryimage"},"image":{"@id":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples#primaryimage"},"thumbnailUrl":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2017\/01\/14234528\/Kickstarter.jpg.webp","datePublished":"2017-01-11T13:00:23+00:00","dateModified":"2024-04-15T06:50:03+00:00","author":{"@id":"https:\/\/creativemarket.com\/blog\/#\/schema\/person\/b1e20fb9aeef6b45762dbab55e31c7c8"},"breadcrumb":{"@id":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/creativemarket.com\/blog\/100-web-typography-examples"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples#primaryimage","url":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2017\/01\/14234528\/Kickstarter.jpg.webp","contentUrl":"https:\/\/d3ui957tjb5bqd.cloudfront.net\/uploads\/2017\/01\/14234528\/Kickstarter.jpg.webp"},{"@type":"BreadcrumbList","@id":"https:\/\/creativemarket.com\/blog\/100-web-typography-examples#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/creativemarket.com\/blog\/"},{"@type":"ListItem","position":2,"name":"100 Brilliant Web Typography Examples"}]},{"@type":"WebSite","@id":"https:\/\/creativemarket.com\/blog\/#website","url":"https:\/\/creativemarket.com\/blog\/","name":"Creative Market Blog","description":"Creative Market Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/creativemarket.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts\/42324","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/users\/144"}],"replies":[{"embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/comments?post=42324"}],"version-history":[{"count":0,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/posts\/42324\/revisions"}],"wp:attachment":[{"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/media?parent=42324"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/categories?post=42324"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/tags?post=42324"},{"taxonomy":"topics","embeddable":true,"href":"https:\/\/creativemarket.com\/blog\/wp-json\/wp\/v2\/topics?post=42324"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}