If I understood you correctly you could just wrap it in span element by using replace and then use v-html to render html. Something like this:

<q-td key="calories" :props="props" v-html="props.item.calories.replace(searchValue, `<span style='color:yellow'>${searchValue}</span>`" > </q-td>

@xdesai Thanks a lot, it’s perfectly what i was searching for 😉

“Object(…) is not a function” error was due to incorrectly importing fuzzysearch as named import instead of default import.

If you follow the showcase code, you should NOT import quasar’s filter function. Search function has to include “done(this.myFilter)” instead of “done(filter)”