When using Flourishes on coloured backgrounds, some colour combinations work better than others.
All the most successful colour combinations are shown below.
Avoid using colour combinations that are not included below as there might not be enough contrast.
If the background is Dark Purple, we can use:
If the background is Bright Purple, we can use:
If the background is Bright Pink, we can use:
If the background is Pastel Pink, we can use:
If the background is Bright Green, we can use:
If the background is Pastel Green, we can use:
If the background is Bright Yellow, we can use:
If the background is Pastel Yellow, we can use:
If the background is White, we can use:
Avoid using the following colour combinations as there might not be enough contrast.
If the background is Pastel Pink, we cannot use:
If the background is Bright Green, we cannot use:
If the background is Pastel Green, we cannot use:
If the background is Bright Yellow, we cannot use:
If the background is Pastel Yellow, we cannot use:
UI elements include:
The colour contrast requirement of 3:1 only applies to the UI element and the immediate background colour. The secondary background colour of the UI element can have a secondary background colour from the Flourish combinations.
*Borders cannot be used to allow non-compliant colour combinations*
Dark Purple can be used with:
Bright purple can be used with: