{"id":724,"date":"2026-06-10T05:21:27","date_gmt":"2026-06-10T05:21:27","guid":{"rendered":"https:\/\/docs.wpinterface.com\/?p=724"},"modified":"2026-06-10T05:21:28","modified_gmt":"2026-06-10T05:21:28","slug":"global-colors-typography-guide","status":"publish","type":"post","link":"https:\/\/docs.wpinterface.com\/global-colors-typography-guide\/","title":{"rendered":"Global Colors &#038; Typography Guide"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Our theme makes it easy to establish your brand identity globally. Instead of changing colors and fonts on every single page, you can set global rules that apply across your entire website.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Global Colors<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To manage your site&#8217;s color palette, navigate to <strong>Appearance \u2192 Customize<\/strong> in your WordPress dashboard, then go to <strong>General \u2192 Base Colors<\/strong>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">1. Accent Color<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">The <strong>Accent Color<\/strong> is the most important color setting on your site. It is used subtly throughout the theme to call attention to key elements, such as buttons, active menu items, and highlights. Set this to your primary brand color.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">2. Content Colors<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Expand the <strong>Content<\/strong> section to manage the colors used in the main body of your website:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Text Color:<\/strong> The primary color for standard paragraph text. Usually, a dark grey (like <code>#333333<\/code>) is best for readability.<\/li>\n\n\n\n<li><strong>Link Hover Color:<\/strong> Defines the color that text links inside your post content change to when a user hovers over them. <em>(Note: Standard links will automatically use your Accent Color, this setting only changes the hover state).<\/em><\/li>\n\n\n\n<li><strong>Headings Color:<\/strong> The default color for all H1, H2, H3, H4, H5, and H6 headings across your site.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">3. Boxed Content Background<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">If you are using a &#8220;Boxed&#8221; layout (configurable under General \u2192 Layout), you can define the <strong>Boxed Content &#8211; Background Color<\/strong> here. This is the color of the &#8220;paper&#8221; your text sits on, usually white or a very light grey.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Global Typography<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">To manage the fonts used across your site, navigate to <strong>General \u2192 Base Typography<\/strong> in the Customizer.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The Business Interface theme integrates seamlessly with Google Fonts, giving you access to hundreds of high-quality typefaces.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">1. Base Font Size &amp; Smoothing<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Base Font Size:<\/strong> This controls the <code>REM<\/code> base of the root HTML element. Adjusting this slider will proportionally scale all typography across your entire site. The default is usually 16px.<\/li>\n\n\n\n<li><strong>Font Smoothing:<\/strong> Enable this to apply anti-aliasing to your text, which makes fonts look crisper and more elegant, especially on Mac\/iOS devices.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">2. Body Typography<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Expand the <strong>Body &amp; Content<\/strong> section to set the font for all standard paragraph text.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Click on <strong>Body Typography<\/strong> to choose a font family, set the font weight (e.g., 400 for normal, 700 for bold), and adjust line-height (spacing between lines of text).<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">3. Headings Typography<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Expand the <strong>Headings (H1 &#8211; H6)<\/strong> section to control your title fonts.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Headings Default:<\/strong> Set a global font family for <em>all<\/em> headings here. This saves time so you don&#8217;t have to select the font 6 different times.<\/li>\n\n\n\n<li><strong>Specific Headings (H1 through H6):<\/strong> If you want to override the default for a specific heading level (for example, making your H1s much larger, or using a different font just for H3s), you can adjust them individually here.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">4. Emphasized Text<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Heading Emphasized Text:<\/strong> The theme allows you to add special styling to <code>&lt;em><\/code> tags used <em>inside<\/em> of headings. This allows you to create beautiful, magazine-style typographic elements by italicizing specific words in a title with a completely different font family (like a script or serif font).<\/li>\n<\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\">Saving Your Changes<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Once your colors and fonts are perfectly aligned with your brand, click the blue <strong>Publish<\/strong> button at the top of the Customizer to save your settings.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Our theme makes it easy to establish your brand identity globally. Instead of changing colors and fonts on every single page, you can set global rules that apply across your entire website. Global Colors To manage your site&#8217;s color palette, navigate to Appearance \u2192 Customize in your WordPress dashboard, then go to General \u2192 Base &hellip; <a href=\"https:\/\/docs.wpinterface.com\/global-colors-typography-guide\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Global Colors &#038; Typography Guide<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[20],"tags":[21],"class_list":["post-724","post","type-post","status-publish","format-standard","hentry","category-general","tag-business-interface"],"_links":{"self":[{"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/posts\/724","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/comments?post=724"}],"version-history":[{"count":1,"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/posts\/724\/revisions"}],"predecessor-version":[{"id":725,"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/posts\/724\/revisions\/725"}],"wp:attachment":[{"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/media?parent=724"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/categories?post=724"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/docs.wpinterface.com\/wp-json\/wp\/v2\/tags?post=724"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}