Styling

Styling can help anchor users’ expectations of user interface performance and output, especially in domains with less exposure to AI.
Use your own judgment in regards to when these common styling patterns can be helpfully applied or should be avoided in order to stand out.

Icons & mascots

Sparkles, magic wands and orbs are most often associated with AI features. Robots are most associated with co-pilots or assistants.

A (non-human) cartoon-like mascot can make users more forgiving and understanding when things don’t go as planned. Ideally it’s also gender-ambiguous and ethnicity-ambiguous. It’s better to overall avoid human-like avatars as AI is not human and should not be portrayed like it.

FigJam’s AI generation feature is shown underneath the “sparkles” emoji.

Notion also shows its AI tools under a “sparkles” emoji when triggered.

Color

Purple is a widely used color to announce AI features and products, but many companies are already starting to branch away from its use. Vibrant coloours with lots of smooth gradients are also typical.

Slacks’s AI is introduced in a predominately purple landing page.

Superhuman’s AI feature is with purple highlights.

Different brand colors

A few examples of AI-powered and AI related tools that do not feature purple as a key brand color.

Elicit’s AI-powered app uses a green-blue palette.

Mozilla’s AI help guides use a primary green color.