{"id":206,"date":"2020-03-17T10:06:22","date_gmt":"2020-03-17T08:06:22","guid":{"rendered":"https:\/\/elementor.com\/help\/?p=206"},"modified":"2024-09-29T14:09:10","modified_gmt":"2024-09-29T11:09:10","slug":"how-to-change-font-size","status":"publish","type":"post","link":"https:\/\/elementor.com\/help\/how-to-change-font-size\/","title":{"rendered":"Change font size, color, family & style in Elementor website builder"},"content":{"rendered":"\n

Many Elementor Widgets<\/em> offer the ability to edit text color and typography settings. These design options are generally located in the widgets\u2019 Style tab<\/strong>.<\/p>\n\n\n\n

Change font typography<\/h2>\n\n\n\n

To change font characteristics<\/strong>:<\/p>\n\n\n\n

    \n
  1. In the panel, locate the Typography<\/strong> field.
    \"\"
    The typography field is usually in the Style<\/strong> tab.
    \"\"<\/li>\n\n\n\n
  2. If you want to select one of the preset global fonts, click the globe \"\" icon.
    For details about global fonts, see View and edit global fonts<\/a>.
    \"\"<\/li>\n\n\n\n
  3. If you want to select a font from among the entire range of fonts, click the pencil icon \"\" .
    \"\"
    The Typography menu opens.
    \"\"<\/li>\n\n\n\n
  4. Use the Family<\/strong> dropdown menu to choose what type of font you want to use.
    If you know the name of the font family, you can enter it in the text box at the top of the dropdown menu.
    \"\"<\/li>\n\n\n\n
  5. Use the Size<\/strong> slider to set how big you want the font.
    \"\"
    To learn more about the different measurement systems, check out     Units of measurement<\/a>.<\/li>\n\n\n\n
  6. Use the other sliders and dropdown menu to set the other font characteristics.
    For details about the different typography characteristics you can choose from, see     Typography<\/a>.<\/li>\n<\/ol>\n\n\n\n

    Change font color<\/h2>\n\n\n\n
      \n
    1. In the panel, locate the Text Color<\/strong> field.
      \"\"
      The Text Color<\/strong> field is usually in the Style<\/strong> tab.
      \"\"<\/li>\n\n\n\n
    2. To select one of the preset global colors, click the globe icon and select one of the global colors.
      For details, see       View and edit Global Colors<\/a>.
      \"\"<\/li>\n\n\n\n
    3. To select a text color from the entire range of colors, click the color swatch \"\".
      For details about using the color picker, see       Pick a color<\/a>.
      The text color is changed.
      <\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"

      Learn how to edit text color and typography of many Elementor widgets<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_elementor_kustomer_id":["65ba3bd0e55be85b540cab21"],"footnotes":""},"categories":[1435],"tags":[],"class_list":["post-206","post","type-post","status-publish","format-standard","hentry","category-getting-around-the-elementor-editor"],"acf":[],"yoast_head":"\nHow to Change Font Size, Color, Family & Style in Elementor | Elementor<\/title>\n<meta name=\"description\" content=\"Learn How to change font size, color, family & style in Elementor page builder to make your article more readable and SEO friendly.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Change Font Size, Color, Family & Style in Elementor | Elementor\" \/>\n<meta property=\"og:description\" content=\"Learn How to change font size, color, family & style in Elementor page builder to make your article more readable and SEO friendly.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\" \/>\n<meta property=\"og:site_name\" content=\"Help\" \/>\n<meta property=\"article:published_time\" content=\"2020-03-17T08:06:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-29T11:09:10+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1396\" \/>\n\t<meta property=\"og:image:height\" content=\"1104\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Alan Kaler\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Alan Kaler\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\"},\"author\":{\"name\":\"Alan Kaler\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/person\/ebf805be1a1abdd587d4b97e3328f430\"},\"headline\":\"Change font size, color, family & style in Elementor website builder\",\"datePublished\":\"2020-03-17T08:06:22+00:00\",\"dateModified\":\"2024-09-29T11:09:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\"},\"wordCount\":275,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/elementor.com\/help\/#organization\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png\",\"articleSection\":[\"Getting around the Elementor Editor\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\",\"url\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\",\"name\":\"How to Change Font Size, Color, Family & Style in Elementor | Elementor\",\"isPartOf\":{\"@id\":\"https:\/\/elementor.com\/help\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png\",\"datePublished\":\"2020-03-17T08:06:22+00:00\",\"dateModified\":\"2024-09-29T11:09:10+00:00\",\"description\":\"Learn How to change font size, color, family & style in Elementor page builder to make your article more readable and SEO friendly.\",\"breadcrumb\":{\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/elementor.com\/help\/how-to-change-font-size\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage\",\"url\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png\",\"contentUrl\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png\",\"width\":1396,\"height\":1104},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/elementor.com\/help\/how-to-change-font-size\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Help Center\",\"item\":\"https:\/\/elementor.com\/help\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Elementor Editor\",\"item\":\"https:\/\/elementor.com\/help\/elementor-editor\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Getting around the Elementor Editor\",\"item\":\"https:\/\/elementor.com\/help\/elementor-editor\/getting-around-the-elementor-editor\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Change font size, color, family & style in Elementor website builder\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/elementor.com\/help\/#website\",\"url\":\"https:\/\/elementor.com\/help\/\",\"name\":\"Elementor\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/elementor.com\/help\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/elementor.com\/help\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/elementor.com\/help\/#organization\",\"name\":\"Elementor\",\"url\":\"https:\/\/elementor.com\/help\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png\",\"contentUrl\":\"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png\",\"width\":225,\"height\":225,\"caption\":\"Elementor\"},\"image\":{\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/person\/ebf805be1a1abdd587d4b97e3328f430\",\"name\":\"Alan Kaler\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/elementor.com\/help\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/7618989d1401c38afe50748601d8dad91fdb8930f53fe037881768b15ab4b108?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/7618989d1401c38afe50748601d8dad91fdb8930f53fe037881768b15ab4b108?s=96&d=mm&r=g\",\"caption\":\"Alan Kaler\"},\"description\":\"Alan Kaler is an expert Elementorist at Elementor and a WordPress Magician who thinks that the three most beautiful words in our language are: I told you\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Change Font Size, Color, Family & Style in Elementor | Elementor","description":"Learn How to change font size, color, family & style in Elementor page builder to make your article more readable and SEO friendly.","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:\/\/elementor.com\/help\/how-to-change-font-size\/","og_locale":"en_US","og_type":"article","og_title":"How to Change Font Size, Color, Family & Style in Elementor | Elementor","og_description":"Learn How to change font size, color, family & style in Elementor page builder to make your article more readable and SEO friendly.","og_url":"https:\/\/elementor.com\/help\/how-to-change-font-size\/","og_site_name":"Help","article_published_time":"2020-03-17T08:06:22+00:00","article_modified_time":"2024-09-29T11:09:10+00:00","og_image":[{"width":1396,"height":1104,"url":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png","type":"image\/png"}],"author":"Alan Kaler","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Alan Kaler","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#article","isPartOf":{"@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/"},"author":{"name":"Alan Kaler","@id":"https:\/\/elementor.com\/help\/#\/schema\/person\/ebf805be1a1abdd587d4b97e3328f430"},"headline":"Change font size, color, family & style in Elementor website builder","datePublished":"2020-03-17T08:06:22+00:00","dateModified":"2024-09-29T11:09:10+00:00","mainEntityOfPage":{"@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/"},"wordCount":275,"commentCount":0,"publisher":{"@id":"https:\/\/elementor.com\/help\/#organization"},"image":{"@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png","articleSection":["Getting around the Elementor Editor"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/elementor.com\/help\/how-to-change-font-size\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/","url":"https:\/\/elementor.com\/help\/how-to-change-font-size\/","name":"How to Change Font Size, Color, Family & Style in Elementor | Elementor","isPartOf":{"@id":"https:\/\/elementor.com\/help\/#website"},"primaryImageOfPage":{"@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage"},"image":{"@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage"},"thumbnailUrl":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png","datePublished":"2020-03-17T08:06:22+00:00","dateModified":"2024-09-29T11:09:10+00:00","description":"Learn How to change font size, color, family & style in Elementor page builder to make your article more readable and SEO friendly.","breadcrumb":{"@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/elementor.com\/help\/how-to-change-font-size\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#primaryimage","url":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png","contentUrl":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2020\/03\/Locate-the-typography-field.png","width":1396,"height":1104},{"@type":"BreadcrumbList","@id":"https:\/\/elementor.com\/help\/how-to-change-font-size\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Help Center","item":"https:\/\/elementor.com\/help\/"},{"@type":"ListItem","position":2,"name":"Elementor Editor","item":"https:\/\/elementor.com\/help\/elementor-editor\/"},{"@type":"ListItem","position":3,"name":"Getting around the Elementor Editor","item":"https:\/\/elementor.com\/help\/elementor-editor\/getting-around-the-elementor-editor\/"},{"@type":"ListItem","position":4,"name":"Change font size, color, family & style in Elementor website builder"}]},{"@type":"WebSite","@id":"https:\/\/elementor.com\/help\/#website","url":"https:\/\/elementor.com\/help\/","name":"Elementor","description":"","publisher":{"@id":"https:\/\/elementor.com\/help\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/elementor.com\/help\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/elementor.com\/help\/#organization","name":"Elementor","url":"https:\/\/elementor.com\/help\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/","url":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png","contentUrl":"https:\/\/elementor.com\/help\/wp-content\/uploads\/2025\/06\/images.png","width":225,"height":225,"caption":"Elementor"},"image":{"@id":"https:\/\/elementor.com\/help\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/elementor.com\/help\/#\/schema\/person\/ebf805be1a1abdd587d4b97e3328f430","name":"Alan Kaler","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/elementor.com\/help\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/7618989d1401c38afe50748601d8dad91fdb8930f53fe037881768b15ab4b108?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7618989d1401c38afe50748601d8dad91fdb8930f53fe037881768b15ab4b108?s=96&d=mm&r=g","caption":"Alan Kaler"},"description":"Alan Kaler is an expert Elementorist at Elementor and a WordPress Magician who thinks that the three most beautiful words in our language are: I told you"}]}},"_links":{"self":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts\/206","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/comments?post=206"}],"version-history":[{"count":20,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts\/206\/revisions"}],"predecessor-version":[{"id":53073,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/posts\/206\/revisions\/53073"}],"wp:attachment":[{"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/media?parent=206"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/categories?post=206"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elementor.com\/help\/wp-json\/wp\/v2\/tags?post=206"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}