INSPECTA

Inspect and edit CSS visually

INSPECTAとは何ですか?

INSPECTAはhttps://inspecta.designによって開発されたChromeの拡張機能で、その主な機能は「Inspect and edit CSS visually」です。

拡張機能のスクリーンショット

screenshot
screenshot
screenshot

INSPECTA拡張機能のCRXファイルをダウンロード

INSPECTA拡張子のファイルをcrx形式でダウンロードし、ブラウザにChrome拡張機能を手動でインストールするか、crxファイルを友達と共有して簡単にChrome拡張機能をインストールします。

拡張機能の使用方法

                        Inspecta is a powerful Chrome extension designed to streamline the visual quality assurance (VQA) process for web designers. With Inspecta Chrome extension, designers can effortlessly inspect the live implementation of web pages, identify UI bugs, and make real-time adjustments to element properties to ensure alignment with the original design.

Key features:

Visual Inspection: 
Designers can visually inspect the live web page, allowing for quick identification of discrepancies between the implemented design and the original design mockup.

Real-Time Editing:
Inspecta enables designers to edit and update element properties directly within the browser, facilitating rapid adjustments to achieve pixel-perfect accuracy.

Inage overlay:
Designers have the option to upload or copy and paste their original design images from Figma as overlays. This feature provides pixel-perfect accuracy by allowing designers to compare the live web page with the original design side by side.

CSS Export:
 Once adjustments are made, designers can export and share the relevant CSS changes with developers, ensuring seamless collaboration and implementation of design updates.

With Inspecta, designers can significantly streamline their QA process, saving time and effort while ensuring consistent visual fidelity between design mockups and live web page implementations.                    

拡張機能の基本情報

名前 INSPECTA INSPECTA
ID pjcfmgokdbdffkcldahbehpemeejglhh
公式URL https://chromewebstore.google.com/detail/inspecta/pjcfmgokdbdffkcldahbehpemeejglhh
説明 Inspect and edit CSS visually
ファイルサイズ 165 KB
インストール数 254
現在のバージョン 0.0.8
最終更新日 2024-03-07
公開日 2023-07-13
評価 5.00/5 合計 1 レビュー
開発者 https://inspecta.design
Eメール [email protected]
支払い方法 free
拡張機能のウェブサイト http://www.inspecta.design
対応言語 en
manifest.json
{
    "update_url": "https:\/\/clients2.google.com\/service\/update2\/crx",
    "manifest_version": 3,
    "name": "INSPECTA",
    "description": "Inspect and edit CSS visually",
    "version": "0.0.8",
    "icons": {
        "16": "logo\/logo-16.png",
        "32": "logo\/logo-32.png",
        "48": "logo\/logo-48.png",
        "128": "logo\/logo-128.png"
    },
    "options_page": "settings\/settings.html",
    "action": {
        "default_title": "Inspecta"
    },
    "permissions": [
        "activeTab",
        "storage"
    ],
    "background": {
        "service_worker": "service-worker.js"
    },
    "content_scripts": [
        {
            "js": [
                "js\/utils.js",
                "js\/cssgenerator.js",
                "js\/colorpicker\/codemirror-colorpicker.min.js",
                "js\/bottombar.js",
                "js\/changes.js",
                "js\/properties.js",
                "js\/main.js",
                "js\/overview.js",
                "js\/rulers\/ruler.js",
                "js\/rulers\/RulersGuides.js",
                "js\/rulers\/Event.js",
                "js\/rulers\/Dragdrop.js",
                "js\/overlay\/overlay.js"
            ],
            "css": [
                "css\/codemirror-colorpicker.css"
            ],
            "matches": [
                ""
            ]
        }
    ],
    "web_accessible_resources": [
        {
            "resources": [
                "test.html",
                "index.html",
                "svgs.html",
                "js\/*",
                "css\/*"
            ],
            "matches": [
                ""
            ]
        }
    ]
}