Collection of free React input type text code examples: placeholders, float labels, etc. Update of December 2019 collection. 6 new items.

Related Articles

  1. CSS Input Text
  2. JavaScript Input Text
  3. jQuery Input Text
  4. Tailwind Input Text
  5. Vue Input Text

Author

  • Alex

Made with

  • HTML / CSS / JS

About a code

Pass Strength Shield

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: gsap.js, react-dom.js

Author

  • Anurag Garg

About a code

React Native Phone Number Input

Performance oriented React native phone number input with typings and proper validation for any country.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Cory L

Made with

  • HTML / CSS (SCSS) / JS (TypeScript)

About a code

Animated Phone Input

A fancy phone number input with animated digits.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: react-dom.js

Author

  • Kamil Thomas

About a code

React Native Places Input

Up to date working Google Places Input. Calling directly API not JS SDK.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Haikel Fazzani

About a code

React Input Tags Using Hooks

A lightweight React component input tags.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Paraboly

About a code

React Native Input Bar

Fully customizable, beautifully designed Input Bar for React Native.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: react-native-spinkit.js, react-native-androw.js, react-native-animated-spinkit.js, react-native-bounceable.js

Demo image: react-input-mask

Author

  • 白俊杰

About a code

React Native Input Scroll View

Perfect text input scroll view.

Author

  • React Native Community

About a code

React Native Text Input Mask

Text input mask for React Native, Android and iOS.

Demo image: React Native Masked Text

Author

  • Ben-hur Santos Ott

About a code

React Native Masked Text

This is a simple masked text (normal text and input text) component for React-Native.

Demo image: React Number Format

Author

  • Sudhanshu Yadav

About a code

React Number Format

React component to format number in an input or as a text.

Author

  • Nikolay

About a code

React Phone Number Input

International phone number input for React.

Author

  • Halil Bilir

About a code

React Native Text Input Effects

Text inputs with custom label and icon animations for iOS and android. Built with react native and inspired by Codrops.

Demo image: React Input Mask

Author

  • Nikita Lobachev

About a code

React Input Mask

Input masking component for React. Made with attention to UX.

Demo image: Text Mask

Author

  • Text Mask

About a code

Text Mask

Text Mask is an input mask library. It can create input masks for phone, date, currency, zip code, percentage, email, and literally anything.

Author

  • Eyal Eizenberg

About a code

React Native Floating Label Text Input

This component will render an iOS styled text field with floating label animation. When there is no value, the placeholder will be centered. Once there is a value, the value will slide down and the label will fade in and slide up.

Author

  • Jed Watson

About a code

React Input Autosize

Auto-resizing input field for React.