# Icon Input components

> Improve forms with 7 icon input components for React, merging icons and Tailwind CSS styling for enhanced user experiences.

37 components available. Showing all of them below.

- [Input](https://21st.dev/@originui/components/input/search-input-with-loader.md) — by Origin UI
- [Input](https://21st.dev/@originui/components/input/input-with-end-inline-button.md) — by Origin UI
- [Input](https://21st.dev/@originui/components/input/search-input-with-icon-and-button.md) — by Origin UI
- [Input](https://21st.dev/@originui/components/input/card-number-input.md) — by Origin UI
- [Input](https://21st.dev/@originui/components/input/input-with-end-icon.md) — by Origin UI
- [Input](https://21st.dev/@originui/components/input/time-input-with-start-icon.md) — by Origin UI
- [Input](https://21st.dev/@originui/components/input/input-with-start-icon.md) — by Origin UI
- [Select](https://21st.dev/@originui/components/select/select-with-icon.md) — by Origin UI
- [Field Components](https://21st.dev/@anubra266/components/field-components/start-icon-input.md) — by Abraham
- [Field Components](https://21st.dev/@anubra266/components/field-components/end-icon-input.md) — by Abraham
- [Create Account Form](https://21st.dev/@ruixen.ui/components/creat-account-form.md) — by Ruixen UI
- [Input](https://21st.dev/@preetsuthar17/components/input.md) — by Preet Suthar
- [Base Input](https://21st.dev/@sean0205/components/base-input/icon.md) — by Sean Hello
- [Base Input](https://21st.dev/@sean0205/components/base-input/addon.md) — by Sean Hello
- [Input](https://21st.dev/@shugar/components/input/disabled.md) — by tigran tumasov
- [Input](https://21st.dev/@shugar/components/input/prefix-and-suffix.md) — by tigran tumasov
- [Input](https://21st.dev/@sean0205/components/input/addon.md) — by Sean Hello
- [Input](https://21st.dev/@sean0205/components/input/icon.md) — by Sean Hello
- [Text Area](https://21st.dev/@ShadcnStudio/components/text-area/textarea-with-start-icon.md) — by ShadcnStudio
- [Text Area](https://21st.dev/@ShadcnStudio/components/text-area/textarea-with-end-icon.md) — by ShadcnStudio
- [The Input](https://21st.dev/@felipemenezes098/components/the-input/with-addon-in-the-end.md) — by felipemenezes098
- [The Input](https://21st.dev/@felipemenezes098/components/the-input/with-addon.md) — by felipemenezes098
- [Floating Input](https://21st.dev/@ruixen.ui/components/floating-input.md) — by Ruixen UI
- [Input Group](https://21st.dev/@shadcn/components/input-group/button-group.md) — by shadcn
- [Url Input](https://21st.dev/@ruixen.ui/components/url-input.md) — by Ruixen UI
- [indevInputui](https://21st.dev/@ln-dev7/components/indev-inputui.md) — by LN
- [Time With Icon](https://21st.dev/@ruixen.ui/components/time-with-icon.md) — by Ruixen UI
- [Animated Input](https://21st.dev/@educlopez/components/animated-input.md) — by Edu Calvo
- [Reshaped Select](https://21st.dev/@reshaped/components/reshaped-select/headless.md) — by reshaped
- [Reshaped Number field](https://21st.dev/@reshaped/components/reshaped-number-field/text-field.md) — by reshaped
- [Reshaped Text field](https://21st.dev/@reshaped/components/reshaped-text-field/faded.md) — by reshaped
- [Reshaped Text field](https://21st.dev/@reshaped/components/reshaped-text-field/sizes.md) — by reshaped
- [Reshaped Text field](https://21st.dev/@reshaped/components/reshaped-text-field/icons.md) — by reshaped
- [HeroUI Input Group](https://21st.dev/@hero_ui/components/heroui-input-group/variants.md) — by Hero Ui
- [HeroUI Input Group](https://21st.dev/@hero_ui/components/heroui-input-group/icon-prefix-and-text-suffix.md) — by Hero Ui
- [HeroUI Input Group](https://21st.dev/@hero_ui/components/heroui-input-group/with-suffix-icon.md) — by Hero Ui
- [HeroUI Input Group](https://21st.dev/@hero_ui/components/heroui-input-group.md) — by Hero Ui

Full component directory: https://21st.dev/llms.txt