Tutorial: How to Add or Change Fonts and Colors on Showit

Customizing fonts and colors is an essential part of personalizing your Showit website. This guide will walk you through the process of adding new fonts, changing text colors, and adjusting your website’s overall color scheme to match your brand.

Step 1: Adding or Changing Fonts

1. Open Showit and navigate to the Canvas view.
2. Select the text box or element where you want to change the font. The text settings will appear in the right-hand panel.
3. Under the Design section, you will see a dropdown for Font.
4. Add a New Font:
   • Showit has a selection of pre-loaded Google Fonts, but you can also add custom fonts. To add a custom font, go to the Fonts section in the Design panel.
   • Click Add Custom Font and upload your font file (e.g., .ttf or .otf) or enter the font URL if hosted externally.
   • Once added, select your font from the dropdown list.
5. Change Font Size, Weight, and Style: After selecting the font, you can adjust the font size, line height, and font weight to fine-tune your text appearance.

Step 2: Changing Text Colors

1. With your text element selected, go to the Design section in the right panel.
2. Under Text Color, click on the color box to open the color picker.
3. Choose a color using the color wheel, or enter a specific hex color code or RGB value for more precision.
4. Apply to Other Elements: You can also change the color of other elements, such as buttons or headings, by selecting them individually and following the same steps.

Step 3: Customizing the Global Color Scheme

1. To adjust the overall color scheme of your website, go to the Settings panel.
2. Under Site Settings, look for the Colors section.
3. Here you can define global colors for your website:
   • Primary Color: Set the main color for buttons, links, and other important elements.
   • Secondary Color: Choose a complementary color for secondary elements.
   • Background and Accent Colors: Adjust these for general background areas and accents throughout your website.
4. These colors will be applied globally across your website, making it easy to maintain a consistent brand look.

Step 4: Previewing and Mobile Optimization

1. After making your changes, click Preview to see how the new fonts and colors look on your website.
2. Switch to Mobile View and make any necessary adjustments for smaller screens, such as resizing text or modifying color contrasts for readability.

Final Notes

Changing fonts and colors on your Showit website is an easy and effective way to reinforce your brand identity. By customizing these elements, you can create a unique and visually cohesive site that resonates with your audience.