Return to site

⚛️React with Material UI 🎨

I have for my daily coding to create a floating label say a text field with a text in the placeholder that moves to the corner when you write in it:

A floating label is a placeholder text for form or input fields, which floats above that field and remains visible once the user starts interacting with that field.

But you know, I have to respect a UI/UX chart, and the floating label is kinda black box that you have to manipulate with special stuff to custom it.

And this special tool to custom the floating label is the ThemeProvider.

You wrap your Textfield in a ThemeProvider tag and then you set the theme that will replicate on the text field.

Here is the video📺👇👇

How to use React with Material UI, a tiny app with a floating label with a theme.