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
- A Power Pages subscription or trial. Get a Power Pages trial here.
- A Power Pages site created. Create a Power Pages site.
- Complete the Add and design a page tutorial.
- A png file of your corporate logo (64 x 64 pixels).
- A list of the hex codes for your corporate color palette.
- A list of your corporate font standards.
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.
Go to Power Pages.
Inside the design studio, mouse over the existing logo and select Image when the flyover appears.
Choose an existing image from the media library, or upload a new image.
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.
Inside the design studio, go to the styling workspace and select the colors you'd like to use for the background and fonts.
Select Save changes.
Set up your corporate brand fonts
Inside the design studio, go to the styling workspace and scroll down to define the font types for headers, subheaders, paragraphs, and buttons.
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.
Select Save changes to update your styling.
The theme you updated will have a modified label.
If at any time you wish to start over, select the ellipses and select Reset to default.
Next steps
Advance to the next article to learn how to a list displaying business data to a page.
Feedback
https://aka.ms/ContentUserFeedback.
Coming soon: Throughout 2024 we will be phasing out GitHub Issues as the feedback mechanism for content and replacing it with a new feedback system. For more information see:Submit and view feedback for