Adding App Colors

Adding colors to your app is a great way to personalize the look and feel of your app. You can choose a color scheme for your app in the Branding section. 

Where to add the app colors

To access the app colors go to Projects (1) and then click on Branding (2).

CleanShot_2021-07-06_at_11.23.17_2x.png

Here you will see the available options for color changes you can make to the app.

App color options

  • Page: The background-color
  • Title bar: The bar shown at the top of the app
  • Text: All text throughout the app
  • Accent: Not currently shown
  • Download: The button color
  • Start: The button color
  • Delete: Not currently shown
  • Coupon: The button color if coupon codes are added

CleanShot_2021-07-06_at_11.21.49_2x.png

 

Below you can see some examples of the color selections shown above displayed in an app.

iVBORw0KGgoAAAANSUhEUgAABwgAAA1ICAYAAACDu8CkAAAACXBIWXMAAAsTAAALEwEAmpwYAAALMWlUWHRYTUw6Y29tLmFkb2Jl-2_4.PNGiVBORw0KGgoAAAANSUhEUgAABwgAAA1ICAYAAACDu8CkAAAACXBIWXMAAAsTAAALEwEAmpwYAAALMWlUWHRYTUw6Y29tLmFkb2Jl-2_6.PNGiVBORw0KGgoAAAANSUhEUgAABwgAAA1ICAYAAACDu8CkAAAACXBIWXMAAAsTAAALEwEAmpwYAAALMWlUWHRYTUw6Y29tLmFkb2Jl-2_5.PNG

Changing the color

To change the default app color for each option, click on the colored squared and it will open a color selection pop-up. 

Now you can either drag the selection tool around to select your color or enter the Hex number if you have a branding guideline to follow.

CleanShot_2021-07-06_at_11.33.24_2x.png

Once the colors are selected don't forget to hit Save at the bottom right of the screen.

 

Accessibility Warning:

Contrast and color use is vital to accessibility. So you may see warnings for contrast ratios for color selections that break accessibility guidelines. Colors will either be too light or too dark.

CleanShot_2021-07-06_at_11.14.08_2x.png

Was this article helpful?
0 out of 0 found this helpful