Tooltips are floating containers for displaying additional information for the currently focused element. A tooltip can be useful when you want to e.g. give a hint about an existing Command Menu shortcut.
Tooltips should be clear and informative, but not imperative to using the interface they refer to. They should not contain interactive elements such as buttons or links.
Export – Export data as a spreadsheet
Export – Export data as a CSV, more information on CSVs
Tooltips should provide useful information and not repeat information that is already present.
Export – Export data as a spreadsheet
Export – Export data
When writing tooltips, always write them in sentence case, not title case. The first word should be capitalized and the rest lowercase (unless a proper noun):
Export data as a spreadsheet
Export Data As a Spreadsheet
Use tooltips sparingly. If your UI is requiring a lot of tooltips, consider revising the interface to provide better explanations and better labelling.
Always provide a tooltip for icon-only buttons or a button with an associated keyboard shortcut.
Don’t use tooltip to communicate critical information, including errors.
Use sparingly. If you’re building something that requires a lot of tooltips, take a step back and work on clarifying the design and the language used instead.
Integration
For integration guidelines, please see Web Components documentation. This documentation explains how to implement and use Nord Web Components across different technologies such as Vue.js, React, or Vanilla JavaScript.
Integration Guidelines
Localization
Nord provides a lightweight solution for localizing its components. Not all components need localizing, as for the most part snippets of text are set per instance. For full localization guidelines, please see Localization documentation.
Localization Guidelines
Troubleshooting
If you experience any issues while using Nord Web Components, please head over to the Support page for more guidelines and ways to contact us.