Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>SVG Font PreviewerNew to Visual Studio Code? Get it now.

SVG Font Previewer

Preview

nkokhelox

|
1,100 installs
| (0) | Free
Show the SVG font details, icons, icon name and icon unicode as hexadecimal value.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

SVG Font Previewer

Build Status

SVG Font Previewer is built for viewing SVG Font files only.

Requirements

  • This depends on xmldom npm library
  • It currently makes use of vscode webview interface.
  • SVG file should meet this criteria for it to work with this extension, resourceLangId == svg or resourceLangId == xml and fileExtension == .svg

Extension Settings

This extension contributes the following settings:

  • svg-font-previewer.iconSortOrder: enum[ascending, descending]
    • ascending: (default) ascending sort order (small comes first e.g. 0 -> 9 -> A -> Z -> a -> z)
    • descending: descending sort order (larger comes first e.g. z -> a -> Z -> A -> 9 -> 0)
  • svg-font-previewer.iconSortBy: enum[unicode, name, none]
    • none: (default) do not sort at all
    • unicode: the icon unicode
    • name: the icon name
  • svg-font-previewer.autoOpenPreview: boolean
    • true: (default) also open the SVG preview when opening the SVG file.
      • This was done so that people can preview SVG automatically just by installing this extension. Then they'll learn to turn it off them selves if they want to
    • false: don't automatically open the SVG preview when opening the SVG file.

Features

This extension supports viewing SVG Fonts only.

  • For SVG font it will show the font name, em size scale, font icons.

Invoke from the command palette

  • Imgur

Invoke from editor actions (Where you usually find preview buttons)

  • Imgur

Changes with the themes

  • Imgur

Known Issues

  • The command is available for any XML document.

  • If there's a wide icon from the font file, then that icon may flow over icons on the right.

    • [Workaround] If this hides some icons then, resizing the preview window may help.
    • Imgur

Release Notes

  • Quickly preview the font details and how the actual SVG font icons look like.
  • Sort the icons preview by icon names or by icon unicode in ascending or descending order.

Updates

  • For detailed changes see our CHANGELOG.md

Credits

  • Artūrs Jansons
  • Yoco technologies
  • Stackoverflow
  • icomoon.io
  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2022 Microsoft