Tutorial: Style your site

Power Pages sites can be customized to incorporate your corporate branding styles. The Styling workspace allows you to set up your brand colors, fonts, and design defaults for your entire site or specific pages.

In this tutorial, you learn how to:

  • Set your corporate logo.
  • Define your color palette.
  • Set up your fonts.

Prerequisites

Adding your corporate logo to Power Pages

This video provides an overview of the steps to add your corporate logo and brand colors to Power Pages.

  1. Go to Power Pages.

  2. Inside the design studio, mouse over the existing logo and select Image when the flyover appears.

    The image button.

  3. Choose an existing image from the media library, or upload a new image.

    Upload image.

  4. Select the image you'd like to use (in this instance, use the corporate logo you uploaded).

Set your brand color palette

You can update the color palette to incorporate two or three primary brand colors, and neutral complimentary colors. These colors can be used consistently across your entire Power Pages site.

  1. Inside the design studio, go to the styling workspace and select the colors you'd like to use for the background and fonts.

    The color palette in the styling workspace.

  2. Select Save changes.

Set up your corporate brand fonts

  1. Inside the design studio, go to the styling workspace and scroll down to define the font types for headers, subheaders, paragraphs, and buttons.

    The fonts options inside the styling workspace.

  2. You can also adjust the sizes and colors for each based on your color palette. Any updates you make are immediately reflected on your site.

  3. Select Save changes to update your styling.

    • The theme you updated will have a modified label.

      The modified label for a theme.

    • If at any time you wish to start over, select the ellipses and select Reset to default.

      Reset to default.

Next steps

Advance to the next article to learn how to a list displaying business data to a page.