Power Apps

Use Adobe Color to Build an Accessible Power Apps Palette

Use Adobe Color for palette exploration, then apply and test the result with Power Apps modern themes or Creator Kit without mistaking colour harmony for accessibility.

Collab365 Team · 23 June 2022 · Updated 24 August 2026 · 4 min read

Adobe Color can help you explore a coherent palette for a Power App. It does not generate a complete Power Apps theme, and an attractive set of swatches is not automatically accessible.

Use Adobe Color to choose and challenge the colours. Use Power Apps theming to apply them consistently. Then test the actual combinations, controls and states that users will see.

Start with roles, not five favourite colours

A usable app palette needs named roles. Define these before opening a colour tool:

  • primary action
  • text on light background
  • text on primary background
  • page and card backgrounds
  • borders and focus indicators
  • success, warning and error
  • selected, hover, pressed and disabled states

Keep meaning separate from decoration. If red means an error, add an icon and useful text. A colour difference alone will not work for every user.

Build the palette in Adobe Color

Open Adobe Color and start with the organisation's approved primary colour if one exists. Explore a harmony rule, then adjust individual swatches rather than accepting the generated set untouched.

Adobe's accessibility tools can highlight swatches that may be hard to distinguish for people with common colour-vision deficiencies. The tool can help you find conflicts, but the final judgement still depends on how colours are paired and used in the app.

Record the chosen hexadecimal values with their semantic roles. For example:

Role Example value Used for
Primary Your approved value Main action and selected navigation
OnPrimary Tested foreground Text and icons on primary
Surface Tested background Cards and forms
OnSurface Tested foreground Body text
Danger Tested status colour Error boundary, with icon and text

The values in your app must come from your tested palette. Do not copy example colours from an article and assume they meet your brand or contrast requirements.

Apply the palette with modern themes

For canvas apps using modern controls, Power Apps provides modern themes. In the authoring menu, open Themes, add a theme, and either create a custom theme or paste a theme in the YAML format supported by the current maker experience.

Modern theming applies more than a single accent colour. Microsoft describes theme control over colour, typography, borders and shadows. Check each control because modern and classic controls do not expose identical styling behaviour.

Use a descriptive theme name and keep the palette under change control. If makers override colours directly on many controls, later theme changes become manual and inconsistent.

Creator Kit uses a different theme object

If the app uses Creator Kit components, follow the Creator Kit theming guidance. Creator Kit components accept a Theme JSON object generated for that kit, commonly stored in a variable and passed to component theme properties.

Do not paste an arbitrary Adobe export into a Creator Kit property and expect it to work. Map your approved palette into the schema produced by the Fluent Theme Designer used by the kit.

This distinction matters:

  • modern canvas themes use the current Power Apps theme experience and supported YAML shape
  • Creator Kit controls use their documented Theme JSON object
  • classic controls may need properties tied to central variables or named formulas

Choose the path that matches the controls in the app. Avoid maintaining three theme systems unless the app genuinely contains all three control families.

Test contrast in context

WCAG 2.2 Success Criterion 1.4.3 sets a minimum contrast ratio of 4.5:1 for normal text and 3:1 for qualifying large text, with defined exceptions. Treat those values as thresholds, not scores to round up.

Check the actual foreground and background pairs for:

  • labels and input text
  • placeholder and helper text
  • buttons in every state
  • links and focus indicators
  • validation and error messages
  • selected rows and navigation
  • charts and status indicators
  • high-contrast or dark-mode behaviour where supported

Opacity, overlays and disabled styling create new colour combinations. A swatch that passed on white may fail when placed on a tinted card.

Also test keyboard focus, zoom, screen readers and meaning without colour. A palette review is only one part of an accessibility review.

A maintainable implementation

Keep one palette record with names that describe purpose, not hue. Danger is easier to maintain than Red1. Apply those roles through the chosen theme system, document intentional exceptions, and test the app after a theme or control update.

The aim is not to make every screen colourful. It is to make actions, information and status predictable without forcing the next maker to hunt through hundreds of control properties.

Sources

Building a Power App that needs to stay consistent after the first maker leaves? Join the Power Apps Builders Space for practical interface and maintainability patterns.