Pular para o conteúdo principal

Grátis · Sem conta · Local

Inspecione qualquer elemento.Copie os valores para sua IA de programação.

Aponte para qualquer elemento para ver a fonte, as cores e o espaçamento. Copie tudo para sua ferramenta de IA para programação.

Não precisa de conta · Nenhuma chamada de rede

Adicionar ao Chrome — grátis Inspecionar esta página
Supreme Bold · 700

Ag

  • Ink
  • Amber
  • Paper
Aa Bb Cc 012392 / 1.0 / −0.028em

O botão abre o painel real no cartão. Aponte para qualquer coisa na página.

O painel

Tudo em uma só visualização

Quando você trava um elemento, o painel agrupa tudo em três seções: Tipografia, Cores e Box. Cada valor exibido pode ser copiado individualmente com um único clique.

  • Tipografia Veja a família da fonte, o tamanho, o peso e o espaçamento entre letras.
  • Cores Veja as cores do texto, do fundo e da borda em hex.
  • Box Confira padding, margin, gap, radius e display.
ou pressione AltShiftE
O painel do SuperchargeInspect travado no glifo Ag do cartão de amostra: Tipografia, Cores, Box, um campo de nota e Copiar referência. O painel do SuperchargeInspect travado no glifo Ag do cartão de amostra: Tipografia, Cores, Box, um campo de nota e Copiar referência.

Copiar referência

Envie elementos para sua ferramenta de IA

Você escreve uma nota curta e depois copia a referência.

  • Nota, endereço da página, localizador do elemento, estilos e trecho da marcação.
  • Print anotado mostrando o elemento travado e o contexto dele.
  • Copie só o texto, só a imagem ou salve como PNG.
Imagem de referência gerada por Copiar referência: o glifo Ag recortado e contornado, com a nota “Use Supreme Bold for the Ag heading.”, o endereço da página e uma linha de estilo.
A demonstração simula uma captura de tela redesenhando a página. A extensão instalada captura sua aba real e a mantém privada.
  • chamadas de rede 0 nenhum dado enviado a lugar nenhum
  • conta Não nenhum cadastro necessário
  • seções do painel 3 tipografia, cores, box
  • formas de copiar 5 valor, referência, texto, imagem, PNG

Controle tudo pelo teclado

  • Alt+Shift+EComeça a inspeção na página ativa. Você também pode usar o botão da barra de ferramentas.
  • Arrow keysVai para o elemento anterior ou para o próximo na página.
  • Ctrl+Up / Ctrl+DownVai para o elemento pai ou para o elemento filho. No macOS, use Option+Up e Option+Down.
  • EnterTrava o elemento para o qual você está apontando. Pressione de novo para escrever uma nota.
  • Ctrl+EnterCopia a referência. No macOS, use Cmd+Enter. Se ainda não houver elemento travado, ele trava e copia.
  • EscVolta para a seleção ou fecha o painel.

Privado e local

Privacidade desde a concepção

Sem chamadas de rede, sem conta.

  • Nenhuma chamada de rede e nenhum dado enviado a nenhum servidor.
  • Sem conta, e nada jamais é enviado do seu dispositivo.
  • Uma captura de tela só sai do seu dispositivo se você salvá-la ou colá-la.
  • Só a sua última seleção por página e a escolha de tema são guardadas.

O que cada guia de recursos aborda

Perguntas frequentes

O que é o SuperchargeInspect?
O SuperchargeInspect é um inspetor de CSS e de elementos. Você aponta para qualquer elemento de uma página e ele mostra a fonte, as cores e o espaçamento em um só painel. Você pode copiar um único valor ou copiar tudo com uma nota e um print anotado para sua ferramenta de IA para programação.
Ele mostra a fonte que o site realmente renderiza?
Ele mostra a família de fonte declarada, não uma fonte renderizada verificada. O painel mostra a primeira família da lista, e ao copiar você obtém a pilha declarada completa. Essa é a fonte que a página solicita. Ele não verifica qual fonte é de fato desenhada na tela, então interprete o resultado como a família declarada.
Quais formatos de cor ele mostra?
As cores são mostradas em hex. Isso inclui a cor do texto, a cor de fundo e a borda, quando houver. Uma cor parcialmente transparente aparece como valor rgba, e uma totalmente transparente aparece como transparent. Você clica em qualquer cor para copiar exatamente esse valor.
O que é copiado para uma ferramenta de IA para programação?
Você escreve uma nota curta e depois copia a referência. O texto copiado contém sua nota, o endereço da página, o elemento e seu localizador, o tamanho da viewport e a posição de rolagem, a posição e o tamanho do elemento, os estilos observados e um pequeno trecho do markup. A captura de tela anotada mostra o elemento com sua nota, o endereço e uma linha curta de estilo.
A extensão envia meus dados para algum lugar?
Não. Tudo o que você inspeciona fica no seu dispositivo. A extensão não faz chamadas de rede e não envia dados. Não há conta. Uma captura de tela só sai do seu dispositivo quando você a salva ou cola em algum lugar, e o que outro app faz com o que foi colado depende desse app.
Quando e onde posso baixar?
Já está disponível no Chrome e no Edge, no Windows, macOS e Linux. Baixe na Chrome Web Store ou nos Complementos do Microsoft Edge. É grátis e não precisa de conta.

Três segundos para instalar.Nada para configurar.

Inspeção de elementos local que mostra a fonte, as cores e o espaçamento de qualquer elemento em um só painel, e copia os valores com uma nota e um print anotado para sua ferramenta de programação com IA.

Adicionar ao Chrome — grátis

Evidência para o ticket

Mostre o bug em vez de descrevê-lo.

Você encontrou um layout quebrado enquanto inspecionava. Grave a aba ou faça um print de página inteira e compartilhe direto no Drive. Sem marca d'água, sem conta.

Adicionar ao Chrome

Grátis · 100% local · Sem conta