UI icons are small graphical representations of a functionality or concept. They provide users with quick and recognisable visual cues that are easy to understand. As part of a consistent icon system, users quickly learn to associate certain icons with certain actions over time.
Don’t scale up icons: The default size of m—wise Loyalty Cloud icons is 24px, but they can be scaled between 16px and 32px and still look clean, consistent and professional. When they’re scaled larger than this, however, it can look messy:
Scaling icons above their intended size can quickly look messy and amateur because the icons weren’t designed with the level of detail necessary for larger sizes. In this example, 48px looks chunky/thick and comically large, because the icon wasn’t designed to scale to that size. At 48px, the stroke weight is 4px which looks heavy and unbalanced.
List of icon states and interactions for the new m—wise Loyalty Cloud:
npm run buildnpm publish