Set up theming components

You use theming components to create, manage, and share themes for canvas apps. A theme contains a collection of styles that define multiple design properties for controls and components such as colors, fonts, and borders. These styles are then applied automatically to controls and components when makers use the themed template app to create a new app.

The theming components solution contains assets that are relevant to makers in addition to designers.

Important

The theming components solution doesn't have a dependency on other components of the CoE Starter Kit. It can be used independently.

Before you begin, review the prerequisites for using the starter kit solution.

  • If you aren't already using the CoE Starter Kit, we recommend creating a new environment for CoE solutions.
  • If you are already using other CoE Starter Kit components, use the environment that you created as part of setting up the core components for this solution.

Prerequisites

  • The Power Apps theming solution contains Power Apps component framework elements. Publishing of canvas apps with code components must be enabled for the environment:

    1. Go to the Power Platform admin center.

    2. Go to your CoE environment, or the environment where you plan to import the solution.

    3. Select Settings.

      Power Platform admin center - environments overview.

    4. Select Product > Features. Power Platform admin center - Environment Product Settings.

    5. Make sure Allow publishing of canvas apps with code components is enabled. Enable publishing of canvas apps with code components in the Power Platform admin center.

Import the solution

  1. Go to the CoE Starter Kit repository, and download the Theming_x.x_managed.zip file from under Assets.

  2. Extract the zip file.

  3. Go to make.powerapps.com.

  4. Go to your CoE environment. In the example in the following image, we're importing to the environment named Contoso CoE.

    Power Apps maker portal environment selection.

  5. On the left pane, select Solutions.

  6. Select Import. A pop-up window appears. (If the window doesn't appear, be sure your browser's pop-up blocker is disabled and try again.)

  7. In the pop-up window, select Choose File.

  8. Select the Center Of Excellence theming solution from File Explorer (Theming_x_x_managed.zip).

  9. When the compressed (.zip) file has been loaded, select Next.

  10. Select Next, and then select Import. (This might take some time.)

  11. When the import succeeds, the list of the components that were imported is displayed.

  12. Select Close.

You can now use the theming components.