# New Component: Streamlit-tags a new way to do add tags and enter keywords **URL:** \ **Category:** Custom Components\ **Tags:** nlp\ **Created:** [March 15, 2021, 3:53pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810 "2021-03-15T15:53:26Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [March 15, 2021, 3:53pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/1 "2021-03-15T15:53:26Z")
Hello, I have created a custom component for Streamlit which is a custom tag function and keywords functions in Streamlit it returns a list and the list can be used as usual. pip install streamlit-tags import streamlit as st from streamlit\_tags import st\_tags keywords = st\_tags(‘Enter Keyword:’, ‘Press enter to add more’, [‘One’, ‘Two’, ‘Three’]) st.write(keywords) More details can be found here: [GitHub - gagan3012/streamlit-tags: streamlit-tags](https://github.com/gagan3012/streamlit-tags) Please star the repo if you liked it and let’s also connect on Linkedin: [https://www.linkedin.com/in/gbhatia30/](https://www.linkedin.com/in/gbhatia30/) Example Usage: [https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py](https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py) Here I generate sentences using Keywords using streamlit tags. ![image](https://global.discourse-cdn.com/streamlit/original/2X/d/dab8f7472e891f88ead93cd7c5df082c4dd48070.png) ---
**Author:** ![thiago](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/thiago/32/22_2.png) [@thiago](https://discuss.streamlit.io/u/thiago)\ **Post date:** [March 15, 2021, 7:51pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/2 "2021-03-15T19:51:37Z")
Cool idea! ---
**Author:** ![Charly\_Wargnier](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/charly_wargnier/32/1504_2.png) [@Charly\_Wargnier](https://discuss.streamlit.io/u/Charly_Wargnier)\ **Post date:** [March 16, 2021, 12:54pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/3 "2021-03-16T12:54:08Z")
Love it! 👏 As a side note, the app [https://share.streamlit.io/gagan3012/keytotext/app.py](https://share.streamlit.io/gagan3012/keytotext/app.py) is crashing. Not sure if this is expected. Thanks, Charly ---
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [March 16, 2021, 1:12pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/4 "2021-03-16T13:12:23Z")
Hello, Thank you so much! There were some issues in that demo. I have updated it Please try this out: [https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py](https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py) ---
**Author:** ![andfanilo](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/andfanilo/32/1040_2.png) [@andfanilo](https://discuss.streamlit.io/u/andfanilo)\ **Post date:** [March 16, 2021, 2:47pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/5 "2021-03-16T14:47:24Z")
Hello @gagan3012, sounds awesome! Could you add it to the [Components Community Tracker](https://discuss.streamlit.io/t/streamlit-components-community-tracker/4634) so we don’t lose track of it? Have a nice day, Fanilo ---
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [March 16, 2021, 3:13pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/6 "2021-03-16T15:13:08Z")
Hello, @andfanilo I have added it to the components tracker can you please approve if it is okay? Also Now I have added support for the sidebar too: ![image](https://global.discourse-cdn.com/streamlit/original/2X/7/78df4359a169bdffde9c709f12a0ab02daba6d08.png) ---
**Author:** ![andfanilo](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/andfanilo/32/1040_2.png) [@andfanilo](https://discuss.streamlit.io/u/andfanilo)\ **Post date:** [March 16, 2021, 6:40pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/7 "2021-03-16T18:40:54Z")
> [@gagan3012](#): > > can you please approve if it is okay? Perfect 🙂 I have nothing to approve since it’s a public free-to-edit Wiki, makes it easier to all collaborate on! ---
**Author:** ![Charly\_Wargnier](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/charly_wargnier/32/1504_2.png) [@Charly\_Wargnier](https://discuss.streamlit.io/u/Charly_Wargnier)\ **Post date:** [March 20, 2021, 10:39pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/8 "2021-03-20T22:39:07Z")
Great app! Btw, I’ve this message when trying to install it. ![image](https://global.discourse-cdn.com/streamlit/original/2X/b/b1cb4acce6a1a319f21fdf8a12ac5ffb6a3adc1a.png) Is it expected? Thanks, Charly ---
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [March 20, 2021, 11:09pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/9 "2021-03-20T23:09:51Z")
Hello @Charly_Wargnier , Thank you so much Please upgrade to streamlit\_tags==1.0.6 using ```auto pip install --upgrade streamlit_tags ``` Currently, it does not support custom theming but I am working on adding support for it. ---
**Author:** ![Charly\_Wargnier](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/charly_wargnier/32/1504_2.png) [@Charly\_Wargnier](https://discuss.streamlit.io/u/Charly_Wargnier)\ **Post date:** [April 6, 2021, 7:07pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/10 "2021-04-06T19:07:07Z")
No worries! Just curious, can you resize the size of the tags with your component? See my ticket here regarding the native solution > [@Widening multi-select labels to avoid text truncation?](https://discuss.streamlit.io/t/widening-multi-select-labels-to-avoid-text-truncation/11397): > > Hi guys, I’d like to widen multi-select labels to avoid text truncation, is this possible? Thanks, Charly Thanks, Charly ---
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [April 6, 2021, 9:31pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/11 "2021-04-06T21:31:39Z")
Hello @Charly_Wargnier Yes, streamlit-tags does support resizing according to text size. If we use the streamlit with wide mode we can enlarge the text box too. Try it out here: [https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py](https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py) ![image](https://global.discourse-cdn.com/streamlit/original/2X/2/2bbbff81e80ff19d22aa489e5dc43a0aeb80bb0f.png) ---
**Author:** ![Charly\_Wargnier](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/charly_wargnier/32/1504_2.png) [@Charly\_Wargnier](https://discuss.streamlit.io/u/Charly_Wargnier)\ **Post date:** [April 6, 2021, 9:47pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/12 "2021-04-06T21:47:46Z")
Brilliant! I’ll try this then! 🙂 Thanks ---
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [April 16, 2021, 12:38am UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/13 "2021-04-16T00:38:34Z")
New Update to Streamlit-tags now it supports text suggestions. We also have conda support now too. Check out: [https://github.com/gagan3012/streamlit-tags…](https://t.co/4DL6PPbLzC?amp=1) for more details. Original post: [https://twitter.com/gbhatia30/status/1382855599529062403?s=20](https://twitter.com/gbhatia30/status/1382855599529062403?s=20) ![image](https://global.discourse-cdn.com/streamlit/original/2X/d/dcdfe8bc20d1f2631e1c45140629c9d5d057dcd3.png) ---
**Author:** ![asehmi](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/asehmi/32/1771_2.png) [@asehmi](https://discuss.streamlit.io/u/asehmi)\ **Post date:** [April 18, 2021, 12:43pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/14 "2021-04-18T12:43:55Z")
@gagan3012 Nice one! A couple of things that would make this useful for me would be allowing a callback to modify the value before it’s inserted into the list (e.g. validation such as spelling/type, or formatting such as lowercasing, capitalisation, etc.), and allowing suggestions to be hooked into a provider function. ---
**Author:** ![gagan3012](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/gagan3012/32/6276_2.png) [@gagan3012](https://discuss.streamlit.io/u/gagan3012)\ **Post date:** [April 18, 2021, 2:52pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/15 "2021-04-18T14:52:02Z")
The callbacks will be implemented soon. @asehmi Can you please explain more about the provider function? Example usage of suggestion parameter can be found here: [https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py](https://share.streamlit.io/gagan3012/streamlit-tags/examples/app.py) ---
**Author:** ![asehmi](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/asehmi/32/1771_2.png) [@asehmi](https://discuss.streamlit.io/u/asehmi)\ **Post date:** [April 19, 2021, 10:27am UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/16 "2021-04-19T10:27:38Z")
@gagan3012 I was just hoping the suggestions list could be dynamically constructed. I can see that it won’t be straightforward to make it more generic, either via a callback or by specifying an object implementing a defined interface to return the list, since the component is written in TS/JS, and is “external” to the Streamlit host application. ---
**Author:** ![Constantine\_Kurbatov](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/constantine_kurbatov/32/5612_2.png) [@Constantine\_Kurbatov](https://discuss.streamlit.io/u/Constantine_Kurbatov)\ **Post date:** [June 3, 2021, 12:36am UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/17 "2021-06-03T00:36:31Z")
Is that works in the white (default) theme? I have tried, and it was displayed in the following way: ![image](https://global.discourse-cdn.com/streamlit/original/2X/6/63fa30c0f5dd13162ff6c3e8e9c1ab2e8dd04dcb.png) ---
**Author:** ![hathao3158](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/hathao3158/32/16674_2.png) [@hathao3158](https://discuss.streamlit.io/u/hathao3158)\ **Post date:** [July 12, 2022, 5:26pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/18 "2022-07-12T17:26:09Z")
> [@gagan3012](#): > > from streamlit\_tags import st\_tags great app! it’s very useful for me! Thank you so much! ---
**Author:** ![sanjoyganguly](https://avatars.discourse-cdn.com/v4/letter/s/f05b48/32.png) [@sanjoyganguly](https://discuss.streamlit.io/u/sanjoyganguly)\ **Post date:** [July 27, 2022, 12:57pm UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/19 "2022-07-27T12:57:17Z")
Hello @gagan3012 Streamlit tags working fine for me. Also, is there any way to disable the add functionality & remove tags functionality through configuration. I want to use the same component for display only the tags as well. ---
**Author:** ![Rom1deTroyes](https://sea2.discourse-cdn.com/streamlit/user_avatar/discuss.streamlit.io/rom1detroyes/32/21268_2.png) [@Rom1deTroyes](https://discuss.streamlit.io/u/Rom1deTroyes)\ **Post date:** [December 22, 2022, 10:13am UTC](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810/20 "2022-12-22T10:13:22Z")
Very nice piece of UI/UX 🎨 > [@gagan3012](#): > > Also Now I have added support for the sidebar too Any tips on how to add a `st_tags` in a already existing sidebar ? Something like `st.sidebar.st_tags(...)` (Also opened an issue about [attaching the widget from outside a container](https://github.com/gagan3012/streamlit-tags/issues/40), as it seems to be the same kind of feature 🙂 ) [Next page](https://discuss.streamlit.io/t/new-component-streamlit-tags-a-new-way-to-do-add-tags-and-enter-keywords/10810.md?page=2)