Features
"Color scheme"
How to set the color scheme of your app?
You can define how your app looks by setting a custom color scheme. This controls the colors used in the header, footer, buttons, icons, and other interactive elements.
Step 1: Open the color scheme settings
- Go to the Theme screen from the Design section in the side menu
- Click on the Color scheme button at the top of the screen
Step 2: Choose how to configure colors
- "Your app colors" option lets you manually select and apply your own brand colors
- "Preset colors" option provides a set of ready-made combinations you can instantly use
- "Get my website’s colors" option allows you to extract and apply colors from your connected website
Click "Retry" to fetch a new set of colors from your website using the "Get my website’s colors" feature.
Step 3: Set each color in your palette
- Base color defines the main color used across the header, bottom bar, and background elements
- Contrast color is used for text and icons that appear on top of the base-colored areas
- Selection color is applied to selected items like tabs, active icons, and highlights
- Highlight color is used for call-to-action buttons and other accent elements between the header and footer
Step 4: Save or reset your selection
- Click Done to save your selected colors
- Click "Reset" to revert all changes
- Click Cancel to discard changes and exit
Preview the design on the demo app or the Preview emulator.
Need more help?
If you've worked through this and still need a hand, contact support — we'll dig in with you.