2

I want to clear the text from the text box, what should be the button named as? what icon and color should the same button have?

Thanks in advance.

  • A simple button saying "Clear" or an "X" will suffice, I suppose. – Edwin Lambregts Jun 25 '15 at 13:23
  • thanks @EdwinLambregts.. any idea on icon and color of the same? – GjA Jun 25 '15 at 13:25
  • Color and icon will depend on your design. The UX aspect of this question is that the notification ought to be clear to your users. When they need to "clear" the notification should just be in the right place. And when they're not interested in clearing the text it ought to fade into the background. – Mayo Jun 25 '15 at 13:42
2

I would say it depends on the scope.

For a single text field you could simply use an x such as the one provided by Font Awesome (here)

If you are clearing all information from the form it'd be better to use a button that has a different color to the submission button. For instance if the submission button is the color green, a good differentiating color would be red. As long as it is consistent throughout the application and the colors don't clash you should be fine.

5

You'll find fields with a little "clear" button in them all over the web. Like this:

enter image description here

4

Clear underlined text

Here is one approach favored by my End Users, have an underlined option stating 'Clear' when the field already has an icon within (calendar in my example).

Having an X clear button within the edit field is good, but coloring it red might mean error after the User types in a text.

The common theme across apps/web is to use a lighter grey/grey colored X button as shown by @Ken Mohnkern above

3

This example tested well with all types of users


It helps if you try it out yourself by clicking the above link but here are the two things that make the X more intuitive and discoverable as a clear button...

  1. Only show the X if there is something to clear

empty

  1. Place the X inside the input instead of next to it

clear

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.