Hex-Grid

Show grid lines directly on any web page and also calculate pixel distances between elements.

What is Hex-Grid?

Hex-Grid is a Chrome extension developed by thehexcord, and its main feature is "Show grid lines directly on any web page and also calculate pixel distances between elements.".

Extension Screenshots

screenshot
screenshot
screenshot
screenshot
screenshot

Download Hex-Grid Extension CRX File

Download Hex-Grid extension files in crx format, manually install Chrome extensions in the browser, or share the crx files with friends to easily install Chrome extensions.

Extension Usage Instructions

                        Have you ever wanted to visualize grid lines directly on web pages or calculate pixel distances between elements on a web page? Then this should be useful to you.

After activating the extension, you can build grids by pulling out vertical lines from the left of the web page and pulling out horizontal lines from the top of the web page.

Delete grid lines by selecting on the line to focus and using either the Backspace or Delete keys.

Calculate pixel distances by clicking to select the starting point and moving the cursor to the destination element.

Toggle the visibility of grid by right-clicking and selecting Toggle Grid Visibility.                    

Extension Basic Information

Name Hex-Grid Hex-Grid
ID pidmjejnmfobkafcmkhppinpladjnnpg
Official URL https://chromewebstore.google.com/detail/hex-grid/pidmjejnmfobkafcmkhppinpladjnnpg
Description Show grid lines directly on any web page and also calculate pixel distances between elements.
File Size 46.79 KB
Installation Count 90
Current Version 1.0.2
Last Updated 2020-11-22
Publish Date 2020-11-16
Developer thehexcord
Email [email protected]
Payment Type free
Extension Website https://github.com/grantfayvor/gridify
Help Page URL https://www.hyperdebugger.dev
Supported Languages en
manifest.json
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "name": "Hex-Grid",
    "version": "1.0.2",
    "manifest_version": 2,
    "description": "Show grid lines directly on any web page and also calculate pixel distances between elements.",
    "browser_action": {
        "default_icon": "images\/hex_grid_logo.png",
        "default_popup": "index.html"
    },
    "permissions": [
        "activeTab",
        "contextMenus"
    ],
    "background": {
        "scripts": [
            "background.js"
        ],
        "persistent": false
    },
    "icons": {
        "16": "images\/hex_grid_logo_w128_h128.png",
        "32": "images\/hex_grid_logo_w128_h128.png",
        "48": "images\/hex_grid_logo_w128_h128.png",
        "128": "images\/hex_grid_logo_w128_h128.png",
        "256": "images\/hex_grid_logo_w256_h256.png",
        "512": "images\/hex_grid_logo_w512_h512.png"
    },
    "web_accessible_resources": [
        "content_script\/rulers.html",
        "content_script\/styles.css"
    ]
}