My team would like to implement a way to inform users that our web app's search bar requires at least 3 characters in order to start a search?

What are the best practices when provided feedback to users about the minimum amount of characters one should enter in order to start a search?


4 Answers 4


I would reckon that there should be some instant feedback text nearby (typically below) the input to let the user know what more they need to do.
You probably only want to show the feedback when the search field is actively being targeted.

Take Stack's comment feature, before the user starts typing it says "Enter at least 15 characters": Stack comment - before

Now after I start typing a comment and it says how many characters are left: Stack comment - during

Another example is React Icons, it simply shows a message as a placeholder over where the results will later be shown, saying how many characters are required before the search will begin. This example has the feedback a little further away, but can be used to sit over the results element(s) React Icons search


I think it depends on how the search box is displayed and designed:

  • If it's displayed inside a page, with enough empty space around itself, you might be able to add a caption text below the input field mentioning the character limit.

  • If it's displayed as a single-line element (inside top bar or navbar), displaying the caption can be a little tricky, and you need to consider a few things:

    • HOW to display:
      • as a tooltip
      • as a notification
      • as a right-aligned text inside the field (it requires horizontal space)
    • WHEN to display:
      • when search box is focused
      • when search is submitted
  • The character limit can also be mentioned directly inside an empty results page, if changing the view is not a problem.

In your case, if you have a search bar, some solutions would be:

  • When the input field is focused, expand the search bar vertically and show a caption below the input field.

  • When the search is submitted, check if the minimum character limit is met, and if not, show either a tooltip, a small notification or place a red text inside the input field (if you have enough space).

  • Let the user execute an empty search and display the character limit inside the empty results page.


You could show a dropdown or a tooltip that updates after anything is typed in the input and the count isn't achieved yet. If the search field shows the results in a dropdown, you can utilize the same dropdown, but display instructions instead of found items. If not - you can go for a tooltip.

You can show said instruction after a little delay (aka debounce), say, 200-400ms. So if the user is fast enough (e.g. if they are typing normally), they won't see the instructions text while entering the start of every query. But if they type and stop (so, most likely, they are done and are expecting something to happen), we show them the instructions and they know to continue typing.

Something like this:

Input field with a dropdown showing information: "Enter at least 3 symbols to start searching"


I would use an event-driven tool-tip which appears on the search the moment a user starts typing.

  • Can you add examples of what you mean and tell why this is a good solution maybe with some background? Short en and opinionated answers like this without substantiation tend to be deleted.
    – jazZRo
    Commented Jan 4 at 12:17

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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