No products in the cart. Shop Now

Inner Banner

How to Customize Colors and Fonts in a Block Theme?

Have you used a block theme for your website? We all know everything is customizable and possible with block themes. Here, we will learn to customize colors and fonts(typography) in a block theme. From top to bottom whatever content you want to change in whatever font style you can do that. You can also customize the color of the heading, paragraph, link, background, button, and caption. You can use color pickers or input HEX or RGB values to set your desired colors.

Likewise, you can change the font of every content available there from heading to link font. You can even increase the font size from small to XXL. You will find options to change the font family, size, weight, and style. Block theme allows you to preview the changes in font and color in real-time to see how they affect your site’s appearance.

How to Customize Colors Using Site Editor in FSE Theme?

Changing color is easy and a task of a second. Beautiful color combinations have the power to attract customers. Follow the following steps to customize colors using site editor in full site editing themes:

  • From your dashboard go to appearance.
  • From appearance click on Editor.
  • Then you should click on Styles.

After you click on style you will see the style page with edit style option as below.

After you click on edit style you will see the theme page at the left and the style option on the right where you will get the option to change the color of text to the heading.

You can change the color of headings, paragraphs, buttons, backgrounds, links, and more from the style panel.

How to Customize Typography/ Fonts using the side editor in FSE(Block) Theme?

Typography enables you to change the font of text, links, captions, buttons, and much more. You can increase the size and style of font in typography as it also plays a vital role in the design and appearance of a website. As you go through color customization, typography has also the same steps you should go for.

  • From your Dashboard go to appearance.
  • Next, hover your cursor to the editor.
  • Then click on style and next click Edit style as you did for color customization.
  • After that click on browser style and then Typography.
  • When you click on typography you will get the following options as shown in the picture.

Choose any options you want to change the font of. let’s take an example of Heading. Click on Headings; You will get options such as H1 to H6, Font family, appearance, line height, letter spacing and letter case.

Change as per your preference. As I said earlier typography enables you to customize different elements such as links, text, captions, headings and buttons. Furthermore, you can change the layout and keep spacing between blocks available here.

We help this post helped you a lot in customizing colors and fonts in FSE themes. For your better understanding you can watch this video when customizing fonts and colors.

Full site editing themes are made of blocks and are easy to customize entire site without codes. If you wish your website build with blocks you can check the best FSE themes of 2024. Or Visit our web page for elegantly design profession FSE Themes.

Leave a Reply