Design Information Tool
Introduction
The Design information tool provides you with basic and advanced design information such as typography of the page.
Element Tab
Element tab provides all information about the selected element.
- CSS selector
- General element information
- Element box model
- Accessibility (Added with 7.2.2 version)
- Element’s DOM code
Accessibility helps you to set the right values for typography. This provides you the text contrast ratio, line spacing ratio, and legibility (font-size) ratio.
Typography Tab
Typography tab provides all information about the page’s typography.
- Color scheme of the current page
- Basic typography information
- Font families
- Animation names
- Page assets (all images used on the page)
Advanced Tab
The information provided in the Advanced tab is usually for developers.
- Page dimensions
- All id tags used in the page
- All classes used in the page
During development, access such information speed ups the development process.
Was this article helpful?
YesNo