If you've ever designed buttons, you know that size is one of the essential characteristics that can make or break the whole user experience. Button design for mobile is a tricky concept, as buttons should be large enough for users to interact with. At the same time, they shouldn't break the visual hierarchy and compositional harmony.

According to the Web Content Accessibility Guidelines (WCAG) recommendations, the touch zone for mobile buttons should be at least 9x9mm, regardless of the screen size, device, or resolution.^[1] It's the average size of a human finger pad area. Material Design Guidelines advise a minimum 48x48px touch area which corresponds to around 9mm.^[2]