{"id":20754,"date":"2022-09-26T13:12:35","date_gmt":"2022-09-26T13:12:35","guid":{"rendered":"https:\/\/www.designmantic.com\/blog\/?p=20754"},"modified":"2023-07-18T07:09:31","modified_gmt":"2023-07-18T07:09:31","slug":"typographic-system-for-brand","status":"publish","type":"post","link":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/","title":{"rendered":"How To Establish A Typographic System For Your Brand"},"content":{"rendered":"<p>Typography is one of the  core tenets of a brand\u2019s visual identity. Along with color and logo design,  typography serves unique brand purposes. It gives depth to the brand character,  makes reading easier, and <a href=\"https:\/\/www.designmantic.com\/blog\/typography-plays-with-moods\/\" target=\"_blank\" rel=\"noopener noreferrer\">adds emotional dimension to the design<\/a>.<\/p>\n<p>When we develop a  typographic system, this is what we are doing:<\/p>\n<ul class=\"margin-left\">\n<li>Choosing a set of 2-3 fonts for  various components of the brand (logo, website, packaging, CTAs, and so on)<\/li>\n<li>Arranging those fonts in levels of  hierarchy so the content becomes easy-to-understand, recognize, and digest.<\/li>\n<\/ul>\n<p>It may look like a  straightforward process, but usually isn\u2019t. You have to think about things like  if your chosen fonts go well together, whether their different combinations are  flexible enough to go on a variety of brand media, and are they able to help  your brand stand out from the competition.<\/p>\n<p align=\"center\"><iframe src=\"https:\/\/www.youtube.com\/embed\/jPhDGKoHCK8\" title=\"YouTube video player\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen=\"\" width=\"560\" height=\"315\" frameborder=\"0\"><\/iframe><\/p>\n<p>A well-structured  typography system achieves all that and more.<\/p>\n<div style=\"margin-top:40px; margin-bottom:40px;\" align=\"center\"><a href=\"https:\/\/www.designmantic.com\/blog\/infographics\/ten-commandments-of-typography\/\" target=\"_blank\" class=\"cta-button\" rel=\"noopener noreferrer\">10 Commandments of Typography For Brands<\/a><\/div>\n<p>But landing on such a  solid system comes with practice and experience. In this post, we are sharing  some well-tested design practices that will help you get there.<\/p>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/images-8.jpg\" alt=\"Typographic Setting - Infographic\" class=\"wp-image-20774\" title=\"Typographic Setting - Infographic\" width=\"800\" height=\"2562\"><\/p>\n<p>But, first let\u2019s  visit some terminology.<\/p>\n<h2>The Difference Between Typefaces and Fonts<\/h2>\n<p>For a casual learner of typography, there isn\u2019t much distinction between typefaces and fonts. In digital design, the two terms are routinely used interchangeably. But if you are designing an entire system of typography, you need to get all the details right and knowing the right terminology will help.<\/p>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typeface-vs-Font.jpg\" alt=\"Typeface vs Font\" title=\"Typeface vs Font\" width=\"800\" height=\"402\"><\/p>\n<p><strong>Typeface:<\/strong> Also referred to as Type Family; it points to a particular design of letters and numerals. Examples: Helvetica, Arial, Times New Roman, and so on.<\/p>\n<p><strong>Font:<\/strong> It\u2019s a subcategory within a typeface and refers to a particular size, weight, and style of a typeface. Examples: Helvetica, 18 pt, Italic. Or Arial, 9 pt, Bold.<\/p>\n<p>Again, for all intents and purposes, it doesn\u2019t matter if you say font and mean typeface. The distinction will only be relevant when you are sitting down and assigning font sizes to your CTAs on app, website, social media, and more.<\/p>\n<h3 class=\"related-post\">Related: <a href=\"https:\/\/www.designmantic.com\/blog\/infographics\/handy-type-glossary-for-noobs\/\" target=\"_blank\" rel=\"noopener noreferrer\">The Handy Type Glossary For Noobs<\/a><\/h3>\n<h2>How To Establish A Typographic System: 7 Steps<\/h2>\n<h3>1. Keep Your Logo Design Separate<\/h3>\n<p>Many people think a brand\u2019s type system covers the typeface and font pairings you use in your logo design, too.<\/p>\n<p>However, the truth is, <a href=\"https:\/\/www.designmantic.com\/blog\/fonts-for-next-gaming-logo-design\/\" target=\"_blank\" rel=\"noopener noreferrer\">your logo type<\/a> and your brand\u2019s larger type  system need to be two different things.<\/p>\n<p>The reason?<\/p>\n<p>To make your logo<u> <\/u>stand out  \u2014 even within your brand\u2019s larger scheme. It should be a distinct piece of  design, prominent on the website, app, product packaging, and more. While your  brand\u2019s typography language must make legibility a fundamental need, a logo  type needs to convey the brand\u2019s inherent character, emotion, and personality.<\/p>\n<div style=\"margin-top:40px; margin-bottom:40px;\" align=\"center\"><a href=\"https:\/\/www.designmantic.com\/logo-design?utm_source=handy-type-glossary-for-noobs&amp;utm_medium=topbutton&amp;utm_campaign=ctatracking\" target=\"_blank\" class=\"cta-button\" rel=\"noopener noreferrer\">Create Your Logo Design<\/a><\/div>\n<p>Look at these beer names for example:<\/p>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Beer-Logos.jpg\" alt=\"Beer Logos\" title=\"Beer Logos\" width=\"800\" height=\"402\"><\/p>\n<p>Each name, with a different font, gives off a unique vibe. A distinct character.<\/p>\n<p>Sixty Nine is round, fuller, and makes you think that the beer will be as rich and hearty as this meaty font. Renegade is bold, confident, but follows tradition. You can rely on this beer; you\u2019ll taste a familiar sample.<\/p>\n<p>It is no accident that these fonts elicit these particular emotions in us. Designers have worked hard here to choose fonts that converge well with each brand\u2019s unique character.<\/p>\n<h3>2. Line Up Your Brand Assets<\/h3>\n<p>Next, it\u2019s time to begin working on your type system.<\/p>\n<p>Start by listing down everything that needs a typeface. Typically, this list will include:<\/p>\n<ul class=\"margin-left\">\n<li>Website<\/li>\n<li>App design<\/li>\n<li>Social media (feed, header,  images, videos)<\/li>\n<li>Print assets (stationery, posters)<\/li>\n<li><a href=\"https:\/\/www.designmantic.com\/blog\/25-typography-designers-for-packaging-design\/\" target=\"_blank\" rel=\"noopener noreferrer\">Packaging and labels design<\/a><\/li>\n<li>And more.<\/li>\n<\/ul>\n<p>This list will also include sub categories. CTAs, photo captions, and blog pages for websites. Headings, subheadings, and body text for print assets. Same thing with packaging and labels.<\/p>\n<p>So list everything down so you know what you are working with. It will not only give you a scope of the problem but will also help you organize your list. You can, for example, group all the headings \u2014 across the brand \u2014- and assign a single font to them.<\/p>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Different-Types-of-Fonts.jpg\" alt=\"Different Types of Fonts\" title=\"Different Types of Fonts\" width=\"800\" height=\"402\"><\/p>\n<p>Similarly, you can reserve one font in a certain color for all CTAs no matter where they are \u2014 website or app \u2014- and do the same thing.<\/p>\n<p>It not only improves consistency but works to make your system more coherent and cohesive, too.<\/p>\n<p>Important Note: this discussion does not apply to the fonts you will choose for your logo. Those should be kept separate to make your logo design appear truly distinct.<\/p>\n<h3>3. Decide between Free, Paid, and Custom<\/h3>\n<p>We have a wealth of typefaces to choose from. Millions of them, actually. Some are paid, some are free, and some you design by yourself.<\/p>\n<ul class=\"margin-left\">\n<li><strong>Paid typefaces<\/strong> are more exclusive and help you  create a brand identity that\u2019s hard to match.<\/li>\n<li><strong>Open source fonts <\/strong>come free and are less  exclusive. But if you aren\u2019t yet ready to commit to a particular style, free  fonts are ideal. You have a lot of variety to choose from and <a href=\"https:\/\/fonts.google.com\/knowledge\" rel=\"nofollow noopener noreferrer\" target=\"_blank\">Google Fonts<\/a> is a good place to start.<\/li>\n<li><strong>Custom typefaces<\/strong> are font designs that you  create from scratch. You need to hire a typography designer for this and it won\u2019t come cheap.<\/li>\n<\/ul>\n<p>Since, there are many variables that will make you lean towards one option or the next, stick to what works for your brand. If you are an SMB or a startup, the most efficient route is to use either a custom font or a free font.<\/p>\n<p>With paid fonts, your licensing fees can add up and you\u2019re still using something that\u2019s available for others.<\/p>\n<p>While free fonts can be limited and available to anyone, they are a huge time-saver. Plus, for a startup, it makes sense to leave room for a future rebrand. As your business and your needs evolve, so can your brand font without costing you an arm and a leg.<\/p>\n<p>Custom fonts give you something truly unique and are worth the price. You are not competing with anyone else and have full control over the typeface.<\/p>\n<p>You can also mix and match. Pair a custom font with a free one or use a paid font for primary content areas whereas use the free type for things that are less important, such as photo captions.<\/p>\n<h3>4. Make A List<\/h3>\n<p>Now that you know which way you are going, shortlist your favorite typefaces. This is a critical phase. You run the risk of getting lost here, overwhelmed by variety. Keep yourself anchored by thinking about what your brand needs, and make a shortlist containing 10-15 typefaces.<\/p>\n<p>Some factors that help in your search:<\/p>\n<ul class=\"margin-left\">\n<li><strong>Distinct:<\/strong> the type must be unique; help your  brand stand out.<\/li>\n<li><strong>Comprehensive: <\/strong>it should contain all the  characters, symbols, letters, and numbers you need, now or in future.<\/li>\n<li><strong>Flexible:<\/strong> <a href=\"https:\/\/www.designmantic.com\/community\/dyslexia-friendly-fonts-for-better-learning.php\" target=\"_blank\" rel=\"noopener noreferrer\">the fonts you choose must be accessible<\/a>, responsive, and work equally well both in print and digital media.<\/li>\n<li><strong>Legible: <\/strong>must be easy to read and comprehend.<\/li>\n<li><strong>Compatible:<\/strong> the fonts you choose should work  together with each other as well as your brand.<\/li>\n<li><strong>Accessible: <\/strong>users with varying amounts  of visual and perceptual abilities are going to consume your content. <a href=\"https:\/\/www.designmantic.com\/blog\/interactive-media\/typography-web-accessibility\/\" target=\"_blank\" rel=\"noopener noreferrer\">Make your type accessible<\/a> for all users so you  can widen your target market.<\/li>\n<\/ul>\n<p>Once you have shortlisted your strongest contestants, let\u2019s move to the next step.<\/p>\n<h3>5. Mix And Match<\/h3>\n<p>This is the meat of the matter. Here you are creating the actual <a href=\"https:\/\/alltimedesign.com\/what-is-typography\/\" target=\"_blank\" rel=\"noopener noreferrer\">typography<\/a> system that we are talking about. Everything we have done so far has led us to this point.<\/p>\n<p>So jump right in.<\/p>\n<p>Take a look at the fonts you have shortlisted. Highlight your strongest suits. And then, mix and match.<\/p>\n<p>You want a maximum of 3 typefaces in your system. Two is the ideal but if you are looking for more flexibility and variety, perhaps a third typeface can help you get there.<\/p>\n<p>Here are a few things to  take care of and <a href=\"https:\/\/www.designmantic.com\/blog\/interactive-media\/8-typography-mistakes\/\" target=\"_blank\" rel=\"noopener noreferrer\">mistakes to avoid<\/a>.<\/p>\n<h3>&#8211; Ideally, Pair A Serif Font With A Sans Serif.<\/h3>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Font-Contrast.jpg\" alt=\"Font Contrast\" title=\"Font Contrast\" width=\"800\" height=\"402\"><\/p>\n<p>The contrast between the two will make your design and content more digestible and appealing. Designers typically choose the serif font for headers and sans serif for body text but you can flip the script for more effect.<\/p>\n<h3>&#8211; Your Font Pairings Should Have Visible Differences.<\/h3>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Bold-vs-Thin-Font.jpg\" alt=\"Bold vs Thin Font\" title=\"Bold vs Thin Font\" width=\"800\" height=\"402\"><\/p>\n<p>This includes differences in sizes, weights, moods, and personalities. Sufficient contrast is necessary to distinguish headers from body text and make reading easier. Fonts that gel well together in terms of moods and personalities are also better than those that are too different. Remember, you want harmony in your design, not discord.<\/p>\n<h3>&#8211; Pair Fonts From The Same Family\/Typeface.<\/h3>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Family-Font.jpg\" alt=\"Family Font\" title=\"Family Font\" width=\"800\" height=\"402\"><\/p>\n<p>It will make your  pairings more harmonious while still staying true to contrast. Variations in  size and weight can achieve <a href=\"https:\/\/www.designmantic.com\/how-to\/how-to-find-the-perfect-font-pair-for-your-design-with-these-rules\" target=\"_blank\" rel=\"noopener noreferrer\">great font pairings<\/a> that remain loyal to the brand mood and personality.<\/p>\n<h3>6. Create A Type Hierarchy<\/h3>\n<p>Hierarchy refers to the <a href=\"https:\/\/www.designmantic.com\/blog\/organize-visual-hierarchy-in-design\/\" target=\"_blank\" rel=\"noopener noreferrer\">system of organization in order of importance<\/a>.  Elements such as size, weight, scale, and colors are used to arrange things in  order and highlight what\u2019s most important and what\u2019s less.<\/p>\n<p>Font organization makes  the text more understandable. It\u2019s the reason you can look at this article and  discern between the title, headings, and text body.<\/p>\n<p>Without type hierarchy,  the content can look like a long piece of similarly-sized, -scaled, and  -colored object.<\/p>\n<p align=\"center\"><img decoding=\"async\" src=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Font-Hierarchy.jpg\" alt=\"Font Hierarchy\" title=\"Font Hierarchy\" width=\"800\" height=\"402\"><\/p>\n<p>For your brand\u2019s typography language, hierarchy will also serve to assign rules to your fonts. You can divide your hierarchy into three levels:<\/p>\n<h3>&#8211; Primary:<\/h3>\n<p>This is your default typeface. It usually aligns well with your logo type and carries the core vibe of your brand. It\u2019s used for things like titles and headers, etc.<\/p>\n<p>Your primary type is the heaviest, largest, and most prominent font so it stands out from the rest of the text.<\/p>\n<h3>&#8211; Secondary:<\/h3>\n<p>It\u2019s shorter and milder than the primary typeface but is still heavy and prominent. It\u2019s usually reserved for subheadings, product labels, and so on.<\/p>\n<h3>&#8211; Body:<\/h3>\n<p>This is the font that will be used the most throughout your content and brand platforms. This is the one where you need the most legibility. It\u2019s used for the body of the text, call-to-action buttons, and such.<\/p>\n<p>To truly <a href=\"https:\/\/www.designmantic.com\/blog\/25-typography-infographics\/\" target=\"_blank\" rel=\"noopener noreferrer\">master the art of typography<\/a>, it\u2019s important  to remember that along with size (how large\/big the font is) and weight (is the  font thick or thin), color is also an integral part of type hierarchy.<\/p>\n<p>It not only  conveys the importance of different sections of the text but assigns emotions  to them, too, and influences behavior. Take CTA buttons, for example. You can  make them the same size as the rest of your text but color them green and  immediately they\u2019ll stand out on the website. Kind of like the underlined blue  of the hyperlinks. Same size as the rest of the text but the color and the  underline helps us spot them from a mile away.<\/p>\n<h3>7. Record the System in Your Style Guide<\/h3>\n<p>Finally, it\u2019s time to write everything down.<\/p>\n<p>We have talked about brand style guides before, so this is a great moment to remind ourselves and everyone that your <a href=\"https:\/\/alltimedesign.com\/what-is-typography\/\" target=\"_blank\" rel=\"noopener noreferrer\">brand\u2019s typography system<\/a> needs to have its own entire section in that guide.<\/p>\n<p>Write down all the rules. Which font goes where and in what color; which is the maximum font size for your headers; as you move from one platform to next, how will the fonts accompany you?<\/p>\n<p>Write everything down so nothing is left to chance. By recording your type system in your brand guide, you ensure consistency of style irrespective of the platform of your brand. It also helps you follow a thought and pattern when your brand starts to grow and your type system needs to evolve with that.<\/p>\n<h3>The Takeaway<\/h3>\n<p>Creating a brand\u2019s typography system is a huge task requiring detailed work. To get it right, two things will work in our favor:<\/p>\n<ul class=\"margin-left\">\n<li>A set of 2-3 typefaces that sync  with each other but still have enough contrasting qualities that allow  distinction between different sections of the text and <a href=\"https:\/\/www.designmantic.com\/blog\/infographics\/font-moods\/\" target=\"_blank\" rel=\"noopener noreferrer\">font moods<\/a> complement the text; and<\/li>\n<li>Knowing about our brand\u2019s core assets (website,  labels, and packaging etc.) that require a typeface and then assignit fonts and  font rules to each of those assets.<\/li>\n<\/ul>\n<p>While this whole process is going to be a game of trial and error, following a few simple guidelines will keep you on the right track. Hopefully, this article has introduced you to some of those essential guidelines and you can use them to mark your path as you go.<\/p>\n<p>Remember, wherever you get stuck, use your brand to point you towards the north again!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Typography is one of the core tenets of a brand\u2019s visual identity. Along with color and logo design, typography serves unique brand purposes. It gives depth to the brand character, makes reading easier, and adds emotional dimension to the design. &hellip; <a href=\"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":20756,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[262],"tags":[],"class_list":["post-20754","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-graphic-design"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How To Design A Typographic System For Brands | DesignMantic: The Design Shop<\/title>\n<meta name=\"description\" content=\"Creating a typography system out of nothing is the stuff of nightmares. But we are here to tell you that there is a method to this madness. Care to find out?\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How To Design A Typographic System For Brands | DesignMantic: The Design Shop\" \/>\n<meta property=\"og:description\" content=\"Creating a typography system out of nothing is the stuff of nightmares. But we are here to tell you that there is a method to this madness. Care to find out?\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/\" \/>\n<meta property=\"og:site_name\" content=\"DesignMantic\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DesignMantic\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-26T13:12:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-18T07:09:31+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typographic-System.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"750\" \/>\n\t<meta property=\"og:image:height\" content=\"418\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Evan Brown\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@https:\/\/twitter.com\/EvanBrownDM\" \/>\n<meta name=\"twitter:site\" content=\"@designmantic\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Evan Brown\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"11 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How To Design A Typographic System For Brands | DesignMantic: The Design Shop","description":"Creating a typography system out of nothing is the stuff of nightmares. But we are here to tell you that there is a method to this madness. Care to find out?","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:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/","og_locale":"en_US","og_type":"article","og_title":"How To Design A Typographic System For Brands | DesignMantic: The Design Shop","og_description":"Creating a typography system out of nothing is the stuff of nightmares. But we are here to tell you that there is a method to this madness. Care to find out?","og_url":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/","og_site_name":"DesignMantic","article_publisher":"https:\/\/www.facebook.com\/DesignMantic","article_published_time":"2022-09-26T13:12:35+00:00","article_modified_time":"2023-07-18T07:09:31+00:00","og_image":[{"width":750,"height":418,"url":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typographic-System.jpg","type":"image\/jpeg"}],"author":"Evan Brown","twitter_card":"summary_large_image","twitter_creator":"@https:\/\/twitter.com\/EvanBrownDM","twitter_site":"@designmantic","twitter_misc":{"Written by":"Evan Brown","Est. reading time":"11 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#article","isPartOf":{"@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/"},"author":{"name":"Evan Brown","@id":"https:\/\/www.designmantic.com\/blog\/#\/schema\/person\/6391d01ed964b5a1184066a18d5bb7f0"},"headline":"How To Establish A Typographic System For Your Brand","datePublished":"2022-09-26T13:12:35+00:00","dateModified":"2023-07-18T07:09:31+00:00","mainEntityOfPage":{"@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/"},"wordCount":2124,"commentCount":0,"publisher":{"@id":"https:\/\/www.designmantic.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#primaryimage"},"thumbnailUrl":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typographic-System.jpg","articleSection":["Graphic Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/","url":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/","name":"How To Design A Typographic System For Brands | DesignMantic: The Design Shop","isPartOf":{"@id":"https:\/\/www.designmantic.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#primaryimage"},"image":{"@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#primaryimage"},"thumbnailUrl":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typographic-System.jpg","datePublished":"2022-09-26T13:12:35+00:00","dateModified":"2023-07-18T07:09:31+00:00","description":"Creating a typography system out of nothing is the stuff of nightmares. But we are here to tell you that there is a method to this madness. Care to find out?","breadcrumb":{"@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#primaryimage","url":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typographic-System.jpg","contentUrl":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2022\/09\/Typographic-System.jpg","width":750,"height":418,"caption":"Typographic System"},{"@type":"BreadcrumbList","@id":"https:\/\/www.designmantic.com\/blog\/typographic-system-for-brand\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Graphic Design","item":"https:\/\/www.designmantic.com\/blog\/category\/graphic-design\/"},{"@type":"ListItem","position":2,"name":"How To Establish A Typographic System For Your Brand"}]},{"@type":"WebSite","@id":"https:\/\/www.designmantic.com\/blog\/#website","url":"https:\/\/www.designmantic.com\/blog\/","name":"DesignMantic","description":"","publisher":{"@id":"https:\/\/www.designmantic.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.designmantic.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.designmantic.com\/blog\/#organization","name":"DesignMantic","url":"https:\/\/www.designmantic.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.designmantic.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2020\/08\/DesignMantic-Logo.png","contentUrl":"https:\/\/www.designmantic.com\/blog\/wp-content\/uploads\/2020\/08\/DesignMantic-Logo.png","width":300,"height":58,"caption":"DesignMantic"},"image":{"@id":"https:\/\/www.designmantic.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DesignMantic","https:\/\/x.com\/designmantic"]},{"@type":"Person","@id":"https:\/\/www.designmantic.com\/blog\/#\/schema\/person\/6391d01ed964b5a1184066a18d5bb7f0","name":"Evan Brown","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.designmantic.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/9f661793780701b84d700350db08494bbbc69f4a5a52f3d53abb33f6190085f8?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9f661793780701b84d700350db08494bbbc69f4a5a52f3d53abb33f6190085f8?s=96&d=mm&r=g","caption":"Evan Brown"},"description":"Evan is an Expert in Digital Marketing. He has been working in the social media space since 2008, with a focus on design services, user interface planning, branding and more. Currently, he is leading content marketing efforts at DesignMantic and has played an integral part in the success story of DesignMantic through strategic marketing campaigns. Evan is also a design pro, who has shown a predilection towards DIY design projects.","sameAs":["https:\/\/x.com\/https:\/\/twitter.com\/EvanBrownDM"],"url":"https:\/\/www.designmantic.com\/blog\/author\/evan-brown\/"}]}},"_links":{"self":[{"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/posts\/20754","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/comments?post=20754"}],"version-history":[{"count":13,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/posts\/20754\/revisions"}],"predecessor-version":[{"id":21936,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/posts\/20754\/revisions\/21936"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/media\/20756"}],"wp:attachment":[{"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/media?parent=20754"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/categories?post=20754"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.designmantic.com\/blog\/wp-json\/wp\/v2\/tags?post=20754"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}