In a single page I would like to display Text Fields for user input and texts, which are static, but have labels. I tried to use the same text fields but with disabled attributes:

enter image description here

However, I am not happy that disabled fields are not bright enough. Actually those fields never meant to be editable, so it appears disabled state is not for them. I also searched some Material UI elements which is text with label, but couldn't find anything appropriate.

How Material UI is depicting elements with important text and label?

  • Ignoring Material Design, what's the user case to show the user the fields they cannot change? – DarrylGodden Jul 16 at 14:46
  • @DarrylGodden To be able to compare visually the string (or just the beginning, end) with something external or copy it to clipboard. – Pablo Jul 16 at 14:52
  • This is not really a question for this site. Maybe ask it on graphicdesign.stackexchange.com – jazZRo Jul 16 at 15:21

Disabled text fields sure is not the right choice. As i understand the text you need to display is not real text but unchangeable attributes that are important to the user.

In this case the label is more like an overline or secondary text. For consistency reasons you might have to align them so they have the same or a similar style to the labels.


enter image description here

  • I am not sure if I understand your solution. Could you please show some wireframe demonstrating what you mean? – Pablo Jul 16 at 15:20

You can try something like this. Hope you get it

enter image description here

  • It's not a hint I am trying to show. It's important piece of information. – Pablo Jul 16 at 17:18

Not the answer you're looking for? Browse other questions tagged or ask your own question.