When you create a basic appearance, you can define in the Dashboard 4 different colors.
Ideally, fill in the color fields using a hexadecimal format, composed with a # followed by 6 letters or numbers.
This precise technical naming can be communicated by your creative team and it will ensure that you use the official colors of your digital style guide.
If you don't have this information in hand, you can simply use the color picker that appears when clicking on the color field.
Button color
This is for the main call-to-action button, that encourages readers to do the suggested action.
Main color
This is the basic color that appears when the paywall gets displayed. This color must be attractive, impactful and must remain integrated in your brand guidelines. There should be a considerable contrast between the color of the button and of the text. Accordinly, we advise against using shades of yellow.
❌ Avoid light colors like yellow
Mouseover color
This is the color of the button when the mouse hovers over it. Here is some advice about choosing this:
use a color that is slightly different from the main color so the readers can see the change
but, at the same time, use a color that is not too different from the main color so as not to create a visual rupture that could be surprising and even unpleasant
use a color that preserves the strong contrast between itself and the button color, as explained above
For example, you could choose to use the same color as the main color, but in a lighter shade.
Skin color
This is used for the horizontal line at the left-hand corner of some of the widgets as well as the unlock confirmation animation.
You should keep two elements in mind when choosing this color:
try to preserve the unlock confirmation text readability by choosing colors that have a strong contrast (this text is white so we advise the you avoid shades of yellow)
try to stay consistent with your corporate visual theme
Subscription color
Most publishers use a dedicated color code whenever they talk about subscriptions. If you fill it in here, it will be used as mouseover color for subscription links. This will guarantee logical and consistent user journeys throughout your website.
Text colors
For obvious consistency, visibility and readability reasons, we made the choice to not make the text colors editable. As an exception, if you really need to edit these colors in order to (for example) use a color like yellow as a button color, you can use the new custom CSS field. Someone from your IT team will be able to write the CSS code needed to implement a bespoke graphical adaptation.
Feel free to contact us on Intercom if you have any questions!