For demonstration, I’ve changed the hotkeys to Win. To change the shortcut, click on ‘Activate Color Picker’ field and press the new keyboard shortcut combination. You can also remap this to any other shortcut you prefer. Only display the custom color controls for users that need to make a custom selection, as the interface can be imposing and confusing to users with low tech-literacy. As you can see in the image below, you can activate the color picker using the keyboard shortcut Win + Shift + C. Use the custom color controls to allow a user to select a color not available in the predefined colors. Custom color selectionĪ color picker can display custom color selection controls. In the majority of use cases, predefined colors should be available. Predefined colors can be omitted, but only where there is a good reason to do so. Use these defaults unless there is a specific reason to redefine the predefined colors. The color picker component is supplied with default predefined colors. Make sure to provide consistent predefined colors in the same column/row layout throughout a single app, a user may want to select the same color for multiple elements. Use predefined colors to give a user a selection of sensible default colors to choose from. Use the triggering element that makes sense in the application use case.īy default, a color picker displays columns or rows of predefined colors. Picking a color as part of a complex component may be best done via a small button. Picking a color as part of a form would make a Select element a good choice. The triggering element is not defined in the color picker component. A color picker is always the preferred method for color selection (instead of, for example, entering raw color hex codes).Ī color picker can be opened from various triggers: buttons, selects or other elements. A color picker provides an interactive experience, allowing a user to explore available color options before making a selection. Use a color picker wherever a user needs to select a color. A user can use the color picker to select a color from predefined palettes or by entering custom values.
0 Comments
Leave a Reply. |