1

I am currently working on standardizing the styling in an application. As part of the process, I want to use rems (ie scaling based on the browser font size) instead of pixels (px) where it improves usability/user experience. I know it's a best practice to scale the website font size by using rems. I also know it's NOT good to scale a border's thickness or radius by using rems.

In general, which aspects of an input would be best to scale with font size from a user-experience perspective? I already know some aspects (font size) would be best to scale with rems and some aspects (border) would not. So, for example, would it be better for the padding on the inside of a text field to grow with rems or remain the same with pixels? Should the margin between inputs change? Should the distance between the text and the icons in a text field change? Anything else? Thank you!

Anatomy of an input

(Image source: https://uxdesign.cc/text-fields-forms-design-ui-components-series-2b32b2beebd0)

Improve this question
4
  • 1
    Can you rephrase the question so that it isn’t purely about implementation? Also have a look at this question: ux.stackexchange.com/questions/152118/… Commented Dec 11, 2024 at 14:47
  • I don't think my question is purely implementation? I'm talking about a best practice... Maybe I don't understand what you would like me to do Commented Dec 11, 2024 at 16:30
  • 1
    Choosing between px or rem is an implementation problem. How spacing impacts user experience is a different question and would fit this website. I suspected the question is about the latter so have a look at the link in my previous comment. If the answer isn’t there, please edit your question in a way that is specific enough to get a relevant answer. Commented Dec 11, 2024 at 17:27
  • 1
    I have edited the question to be more general and focus more on best practices instead of my specific situation. Hope that is what you are looking for. If not, I apologize, I am new to this stack exchange. Commented Dec 11, 2024 at 23:17

0

Reset to default

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.