Stay organized with collections
Save and categorize content based on your preferences.
Blockly provides keyboard navigation through the @blockly/keyboard-navigation
plugin. This code uses the focus system
and will eventually be integrated into Blockly core.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-08-28 UTC."],[[["\u003cp\u003eBlockly's keyboard navigation allows users to move, connect, add, detach blocks, and navigate the toolbox and flyout using keyboard shortcuts.\u003c/p\u003e\n"],["\u003cp\u003eUsers can enable keyboard navigation with \u003cstrong\u003eShift + Ctrl + k\u003c/strong\u003e and utilize \u003cstrong\u003eWASD\u003c/strong\u003e keys along with \u003cstrong\u003eEnter\u003c/strong\u003e, \u003cstrong\u003eI\u003c/strong\u003e, and \u003cstrong\u003eX\u003c/strong\u003e to perform various actions.\u003c/p\u003e\n"],["\u003cp\u003eNavigation is structured into levels (workspace, stack, block/connection, field/input) for traversing blocks and their components.\u003c/p\u003e\n"],["\u003cp\u003eThe default key mappings can be customized, and users are encouraged to experiment with different configurations.\u003c/p\u003e\n"],["\u003cp\u003eCurrent limitations include lack of navigation support for non-block components like the trash can and zoom buttons.\u003c/p\u003e\n"]]],["Keyboard navigation in Blockly is enabled via **Shift + Ctrl + k**, which initiates a cursor. Users navigate the workspace using **WASD** keys across different levels: workspace, stack, block/connections, and fields/inputs, with levels changed using **A** and **D**. **Enter** creates a marker for block insertion. Blocks can be connected by marking a connection with **Enter**, then moving and using **I** to insert. Blocks can be detached using **X**. The toolbox is accessed with **T**, and blocks are inserted with **Enter**. There are opportunities for experimentation in key mappings, screen reader output, workspace navigation and cursor design.\n"],null,["Blockly provides keyboard navigation through the `@blockly/keyboard-navigation`\nplugin. This code uses the [focus system](/blockly/guides/configure/web/focus)\nand will eventually be integrated into Blockly core.\n\nYou can [download the plugin from\nnpm](https://www.npmjs.com/package/@blockly/keyboard-navigation) or get the code\nfrom the [`blockly-keyboard-experimentation`\nrepository](https://github.com/google/blockly-keyboard-experimentation/) on\nGitHub.\n\nIf you want to play with the plugin, visit the [accessibility plugin\nplayground](https://google.github.io/blockly-keyboard-experimentation/).\n\n- To get started, click the workspace or press `tab` until you reach the workspace.\n- Use the arrow keys to move around.\n- Press `T` to open the toolbox.\n- Press `Enter` or `Space` to edit or confirm.\n- Press `/` for a complete list of keyboard commands.\n\nFor more information about our accessibility projects, visit [our accessibility\npage](https://developers.google.com/blockly/accessibility#projects).\n| **Note:** The 0.6 version of the keyboard navigation plugin that existed prior to Blockly v12 has been removed."]]
