Descrição da ferramenta: Peksy é uma extensão gratuita para Chrome que captura o contexto de elementos DOM, facilitando a integração com assistentes de IA para codificação, oferecendo informações detalhadas e visualização 3D do layout da página.
Atributos:
🔍 Captura de contexto: Permite selecionar elementos DOM e copiar seu HTML, classes e atributos para uso em assistentes de IA.
📝 Facilidade de uso: A operação é realizada com comandos simples (Cmd+Shift ou Ctrl+Shift) e clique, tornando o processo ágil.
📋 Integração com IA: Facilita a transferência de informações ao ChatGPT, Claude ou Cursor para auxiliar na geração de código.
🌐 Visualização 3D: Pressionando Ctrl+Shift+3, exibe a estrutura DOM em um formato tridimensional para depuração visual.
⚙️ Detalhamento do elemento: Fornece detalhes completos do elemento selecionado, incluindo hierarquia e atributos relevantes.
Exemplos de uso:
💻 Análise de layout: Visualizar a estrutura DOM em 3D ajuda na identificação de problemas relacionados ao empilhamento (z-index).
🤖 Apoio na codificação: Copiar o contexto do elemento para inserir no ChatGPT ou outros assistentes ao criar componentes específicos.
🔧 Depuração rápida: Selecionar elementos durante o desenvolvimento para entender suas classes e atributos imediatamente.
🧩 Edição de código: Obter informações detalhadas sobre elementos complexos ao ajustar estilos ou scripts.
📁 Análise estrutural: Inspecionar hierarquias DOM completas para otimizar a organização do código HTML.