Overview
Visualize web structure in 3D using DevTools.
Visualize any web page's DOM structure in 3D Space! WebページのDOM構造を3D空間で可視化！ DOM-3D Visualizer JS: Visualize the Web in 3D A powerful developer tool that transforms the DOM structure of any webpage into a 3D visualization. Key Features: Instant 3D Rendering: Visualize complex hierarchies with a single click. Interactive Highlighting: Sync between 3D elements and actual page components. Adjustable Z-Scale: Control the depth of layers to suit your needs. PNG Export (Free Beta): Save your 3D visualizations as images for documentation or sharing. DOM-3D Visualizer JS: ウェブ構造を立体的に体感する この拡張機能は、ブラウザに表示されているHTML要素（DOM）を3D空間に展開し、視覚的に分析できるデベロッパーツールです。 主な機能: ワンクリック3D表示: 複雑な階層構造を一瞬で立体化します。 双方向ハイライト: 3Dモデル上の要素と実際のページ要素をリアルタイムで照らし合わせます。 高さ（Z軸）調整: 重なりの深さを自由に変更可能。 PNG出力 (無料ベータ版): 3D化した構造を画像として保存し、資料作成や共有に活用できます。 開発者のデバッグ作業や、プログラミング学習におけるDOM構造の理解を強力にサポートします。 How to Use: Open Chrome DevTools (F12 or Right-click > Inspect). Select the "DOM-3D" tab. Click the "Visualize Page" button to generate the 3D model. Controls: Left Click + Drag: Rotate the model. Right Click + Drag: Pan (Move) the camera. Scroll Wheel: Zoom In / Out. Hover: Highlight the corresponding element on the actual web page. Right Click on Element: Copy the CSS Selector of the selected element to your clipboard. 操作方法: デベロッパーツールを開きます（F12キー または 右クリック > 検証）。 **「DOM-3D」**タブを選択します。 **「ページ全体を3D表示」**ボタンを押すと、3Dモデルが生成されます。 マウス操作: 左ドラッグ: モデルの回転 右ドラッグ: カメラの並行移動 スクロールホイール: ズームイン / ズームアウト ホバー: 実際のWebページ上の要素を強調表示（連動） 要素を右クリック: その要素の CSSセレクタをクリップボードにコピー
Details
- Version1.1.1
- UpdatedApril 7, 2026
- Size290KiB
- Languages2 languages
- DeveloperWebsite
Email
admin@sencat-dev.com - Non-traderThis developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.
Privacy
This developer declares that your data is
- Not being sold to third parties, outside of the approved use cases
- Not being used or transferred for purposes that are unrelated to the item's core functionality
- Not being used or transferred to determine creditworthiness or for lending purposes
Support
For help with questions, suggestions, or problems, visit the developer's support site
