7/5/2023 0 Comments Button color ui![]() ![]() Contained button (high emphasis) Contained buttons have more emphasis, as they use a color fill and shadow. Outlined Button (medium emphasis) Outlined buttons are used for more emphasis than text buttons due to the stroke. Use more toned down or inverted colours (e.g. Text button (low emphasis) Text buttons are typically used for less important actions.Use darker colours for the most used or most important actions to guide your user’s attention towards it.To summarize this section (and give you some extra ideas), here are some of our top tips for tactical button design: ![]() Color here helps to give the user some clues as to what each button does to speed up the processes within the app.Īn app in retool: a table component next to a container which has three buttons above it as tabs 1824×407 49.1 KBĪlthough it may seem subtle and perhaps inconsequential, small details such as these can guide the user to the correct action buttons quicker and avoid confusion. This means that your user needs to read (or remember the position of) each button before clicking, which can slow productivity, and once again, lead to silly mistakes. We’ve seen many Retool apps defaulting religiously to the blue button that Retool provides as standard - and not only is this (sorry) really quite boring for the user, it also means that you are relying too heavily on the text of each action button. It’s a well-known tactic in marketing UI to use color to draw attention to the key action buttons which convert to sales - but this concept is not reserved for marketing alone, it can be really useful in internal apps too! By using color intentionally, developers can aid productivity by guiding users to the correct or important actions. Tip #3 from our UI session focusing on buttons, which gives some tips, tricks and best practises for using the button component in Retool - read more on our site. ![]()
0 Comments
Leave a Reply. |