Tools
Code Editor Extensions
The Visual Studio Code Extension
It supports:
- plain
px
torem
conversion. - annotation for
px
andrem
equivalent values. - auto completion for the spacing system.
- auto completion for
font-size
andline-height
.
Install the VSCode Extension or view the source code.
Screenshots
- Spacing System example
![Auto completion for px/rem spacing system](/static/6579f3373caa933df808bf400e16f08f/2bef9/eufemia-vscode-extension-spacing.png)
- Equivalent to
px
orrem
value example
![Tooltip for px/rem equivalent](/static/97e79d8f4a44f52c15291634f56200d9/2bef9/eufemia-vscode-extension-hover.png)
font-size
example
![Auto completion for font-size](/static/2ca7a2f12bd91efc85a1a964de446967/2bef9/eufemia-vscode-extension-font-size.png)
ESLint Plugin
You may have a look at the Eufemia ESLint Plugin it will over time extend with more rules that can help you detect issues or recommendations.