Solidity Security in Visual Studio Code

Solidity Visual Developer

  • Advanced Solidity Language Support
  • Code Augmentation
  • Source Exploration
  • Visual Security Linting

An extension that supports developers in writing secure and well understood code

This extension contributes security centric syntax and semantic highlighting, a detailed class outline, specialized views, advanced Solidity code insights and augmentation to Visual Studio Code.

⚠️ Note: Customize this extension to fit your needs! Show/Hide/Enable/Disable features in Preference → Settings → Solidity Visual Developer: solidity-va.*, select one of the customized security-aware color themes in Preferences → Color Themes.

We ❤ feedback → get in touch!

Marketplace: ext tintinweb.solidity-visual-auditor



visual-auditor-new vscode-solidity-auditor-uml 


Semantic highlighting and solidity insights for passive security awareness. Most features are configurable (preferences -> Settings -> Solidity Visual Developer)

Themes (preferences -> Color Theme):

dark_small light_small solarized_small

  • Visual Auditor Dark - based on the "Atom One" theme
  • Visual Auditor Light (Visual Studio) - based on the standard "light (VSCode)" theme
  • Visual Auditor Solarized Light - based on the standard "Solarized Light" theme

Syntax Highlighting

  • access modifiers (external, public, payable, ...)
  • security relevant built-ins, globals, methods and user/miner-tainted information (, tx.origin,, block.*, now)
  • storage access modifiers (memory, storage)
  • developer notes in comments (TODO, FIXME, HACK, ...)
  • custom function modifiers
  • contract creation / event invocations
  • easily differentiate between arithmetics vs. logical operations
  • make Constructor and Fallback function more prominent

Code fragments passively draw your attention to statements that typically reduce risk or need your attention .

Semantic Highlighting

  • highlights StateVars (constant, inherited)
  • detects and alerts about StateVar shadowing
  • highlights function arguments in the function body

Review Features

  • audit annotations/bookmarks - @audit - <msg> @audit-ok - <msg> (see below)
  • generic interface for importing external scanner results - cdili json format (see below)
  • codelens inline action: graph, report, dependencies, inheritance, parse, ftrace, flatten, generate unittest stub, function signature hashes, uml

Graph- and Reporting Features

  • vscode-solidity-auditorSūrya
    • access your favorite Sūrya features from within vscode!
    • interactive call graphs with call flow highlighting and more!
  • auto-generate UML diagrams from code to support your threat modelling exercises or documentation!

Code Augmentation

  • Hover over Ethereum Account addresses to download the byte-code, source-code or open it in the browser
  • Hover over ASM instructions to show their signatures
  • Hover over keywords to show basic Security Notes
  • Hover over StateVar's to show declaration information


  • Cockpit View
    • Explore and focus on solidity files in your workspace
    • Generate report/graphs for any files/folders selected in the explorer views
    • Selectively flatten files
    • Search for contracts that are likely to be deployed in the system
    • Context-sensitive views: click into a contract in the editor to list public state-changing method
    • Get quick access to extension settings
  • Outline View
    • populates VS Code outline view with sourceUnit and contract layout
    • contracts, stateVars, methods, inherited names
    • annotates security relevant information (visibility, ...)
    • calculates complexity rating
    • annotations functions with information about whether they are accessing stateVars


Method 1: Install by going to Visual Studio Market Place and click Install.

Method 2: Bring up the Extension view in VS Code and search for Solidity Visual Developer and click Install

Method 3 (Manual):

  1. Download the latest compiled extension as *.vsix
  2. Fire up Terminal and install the extension by running code --install-extension "solidity-visual-auditor-0.0.x.vsix"
  3. vscode --> preferences --> color scheme --> Solidity Visual Developer Dark


Scroll down and take the tour.


  • semantic highlighting for state variables (constant=green, statevar=golden, inherited=blue)
  • semantic highlighting for function arguments
  • outline view with security annotations and inherited names
  • tooltips (asm instruction signatures, security notes)
  • @audit tags
  • graph's and uml
  • generic interface to import issues from external scanners
  • Cockpit View

Feature: Ethereum Account Address Actions

Ethereum Account Address Actions

  • open the account on
  • show the contract code
  • show the VerifiedContract source code
  • decompile the byte-code. requires vscode-decompiler

imageFeature: Semantic function argument highlighting

Semantic function argument highlighting

  • arguments are assigned different colors in the scope of the function

semantic-arg-dark semantic-arg-lightFeature: Inline Bookmarks

Inline Bookmarks: @audit tags

This feature is provided by Inline Bookmarks.

  • @audit - <msg> ... flag lines for security review or start a security review discussion
  • @audit-ok - <msg> ... flag that a line was checked for security or a security discussion on that line turned out to be a non-issue

audit-tagsFeature: Code Augmentation / Annotations / Hover / Tooltip

Code Augmentation / Annotations / Hover / Tooltip

  • additional information for various keywords (including security notes)


  • asm instruction signatures


  • Address hover integration via tintinweb.vscode-ethover
    • Open it in etherscan (or whatever you configure)
    • Show address balance in hover (mainnet) (note: might be rate-limited, configure your API key in settings)
    • Download the bytecode and disassemble it.
      • With hover info on instructions
      • Representation of data as ASCII and resolving 4bytes to funcsigs, Color code reflects the type of instruction: stack, memory, storage, arithm., logic, system, environment, …
    • Download the bytecode and show it.
      • With hover info
      • Click to see instruction boundaries
      • Color coded bytes to reflect type of instruction)
    • Show verified contract source (
    • Show reconstructed contract source from
    • Show reconstructed contract source from evm.js
    • run vscode-decompiler to decompile it manually using panoramix ( locally

imageFeature: State Variable Highlighting

State Variable Highlighting

  • highlight contract local stateVars (golden box)


  • alert on a shadowed variable (red box)


  • highlight const stateVar (green box)


  • highlight inherited stateVar (blue box Approval)

code_inheritedFeature: CodeLenses


  • surya - interactive graph


  • surya - generate report, show inheritance, show AST



  • surya - ftrace


  • UML - auto-generate UML for source-units or specific contracts


  • Function Signature Hashes

sva_light_vscodeFeature: Outline View

Outline View

  • library with function parameters T and declarations


  • class and events, functions annotated (stateMutability, visibility)


  • class and events, functions annotated (stateMutability, visibility)


  • inheritance browser - resolves inheritance, only shows inherited names


  • extra information (subjective function complexity; accesses stateVar?)

outline_extraFeature: Cockpit View

Cockpit View

We've been working on a new cockpit view that allows you to navigate large codebases more efficiently. Check out the new  sidebar-logo  icon in the activity bar to your left.

So, what can you do with it?

  • Explore .sol files with the new workspace explorer
  • Generate report/graphs for any files/folders selected in the explorer views 
  • Conveniently flatten selected files (selected folders or all files in the top-level view) (Note: truffle-flattener may require an npm install of the project for flattening to work)
  • Search for contracts that are likely to be deployed in the system (complete workspace or selected folders) 
  • Context-sensitive views: click into a contract in the editor to list public state-changing methods 
  • Get quick access to extension settings 

And there is more to come 🙌 stay tuned!

Note: The cockpit view is fully customizable. You can hide both the sidebar menu or any view in the cockpit that you do not need (right-click → hide).

BuiltIn: Commands


  • suggest top level contracts aka "entrypoint contracts" (most derived)
  • flatten current (codelens) or all suggested top level contracts (command) vscode-auditor-flaterra
  • list all function signatures (human readable or json format)
  • open remix in external browser

Please refer to the extension's contribution section to show an up-to-date list of commands.

Theme: Solidity Visual Developer Light (VSCode)

Theme: Solidity Visual Developer Light (VSCode)

theme_light_vsTheme: Solidity Visual Developer Dark

Theme: Solidity Visual Developer Dark

Simple DAO

screenshot 2019-02-09 at 12 30 30

Vulnerable Contract


Theme: Solidity Visual Developer Solarized Light

Theme: Solidity Visual Developer Solarized Light

Simple DAO

screenshot 2019-02-11 at 21 52 11Configuration: Settings & Customizations

Extension Settings

  • .. Enable/Disable all active components of this extension (emergency master-switch).
  • Solidity-va.parser.parseImports ... Whether to recursively parse imports or not
  • Solidity-va.hover ... Enable or Disable generic onHover information (asm instruction signatures, security notes)
  • Solidity-va.deco.statevars ... decorate statevars in code view (golden, green, blue boxes)
  • Solidity-va.deco.arguments ... enable/disable or select the mode for semantic highlighting of function arguments. (default: 'enable' = 'color and arrow')
  • Solidity-va.deco.argumentsMode ... select the mode for semantic highlighting of function arguments (may require a reload)
  • Solidity-va.deco.argumentsSuffix ... a custom Suffix/Symbol that is appended to the decoration when performing semantic highlighting for function arguments
  • Solidity-va.outline.enable ... enable/disable outline and symbolprovider
  • Solidity-va.outline.decorations ... decorate functions according to state mutability function visibility
  • ... add inherited functions to outline view
  • Solidity-va.outline.extras ... annotate functions with extra information (complexity, statevar access)
  • Solidity-va.outline.var.storage_annotations ... Whether to show/hide storage annotations for variables in the outline view
  • ... Whether to show/hide pragmas in the outline view
  • ... Whether to show/hide imports in the outline view
  • Solidity-va.diagnostics.import.cdili-json ... Automatically import diagnostic issues from external scanners using the cdili-issue.json format:
    "onInputFile": "contracts/BountiesMetaTxRelayer.sol", 
    "atLineNr": "10", 
    "ruleType": "code_smell", 
    "severity": "major", 
    "linterVersion": "0.1", 
    "linterName": "maru", 
    "message": "State Variable  Default Visibility - It is best practice to set the visibility of state variables explicitly. The default           visibility for \"bountiesContract\" is internal. Other possible visibility values are public and private.",         
    "forRule": "State_Variable_Default_Visibility"
  • Solidity-va.codelens.enable ... enable/disable codelens support (inline code actions)
  • ... open dot output in graphviz rendered form
  • solidity-va.preview.markdown ... open markdown output in rendered form
  • ... Define whether surya should take cached files or all contracts in the workspace as input

Please refer to the extension's contribution section to show an up-to-date list of settings.


Known Issues

  • outline view does not always refresh. TempFix: modify and save the file to trigger a refresh.
  • codelenses do not appear. TempFix: modify and save the file to trigger a refresh.
  • github issues


Release Notes


View on GitHub: 

#blockchain #web3 

1.05 GEEK