100 bookmarklets úteis e variados para turbinar o navegador

Bookmarklets são pequenos programas JavaScript guardados no endereço de um favorito. Ao clicar neles, o navegador executa uma ação sobre a página atual: limpar distrações, copiar uma citação, investigar acessibilidade, listar imagens, acelerar vídeos ou abrir a URL em outra ferramenta.

Esta coleção traz 100 bookmarklets autocontidos e legíveis. Nenhum deles busca ou executa JavaScript remoto. Alguns abrem serviços externos e, nesses casos, o texto avisa que a URL ou seleção será enviada ao serviço.

Resumo executivo

Os mais úteis para quase qualquer pessoa são:

remover sobreposições fixas;
modo de leitura;
alternar modo escuro;
limpar parâmetros de rastreamento;
copiar título e URL em Markdown;
pesquisar o texto selecionado;
abrir a página no Wayback Machine;
pesquisar somente dentro do site atual;
contar palavras;
transformar uma tabela em CSV;
mostrar imagens sem texto alternativo;
listar títulos e estrutura da página;
pausar, silenciar ou acelerar todos os vídeos;
verificar domínios de terceiros e conteúdo misto;
baixar uma nota Markdown com fonte e trecho selecionado.

Metodologia e segurança

Os códigos foram escritos ou adaptados a partir de padrões documentados pelo MDN, coleções clássicas como Squarefree e ferramentas abertas de acessibilidade. Cada trecho foi mantido autocontido para facilitar auditoria. Os 100 blocos tiveram a sintaxe JavaScript validada individualmente; o comportamento final ainda depende da página, das permissões e do navegador.

Antes de usar

Crie um novo favorito.
Use o nome indicado.
Copie toda a linha que começa com javascript:.
Cole no campo de endereço/URL do favorito.
Abra uma página comum e clique no favorito.

Não teste em páginas internas como chrome://, about:, loja de extensões ou leitor interno de PDF: navegadores normalmente proíbem scripts nesses contextos.

Alertas

Um bookmarklet executa com acesso à página aberta. Leia o código antes de usar código de terceiros.
Políticas CSP podem bloquear certos recursos, sobretudo estilos ou scripts injetados.
Alguns navegadores removem javascript: quando o código é colado diretamente na barra de endereço. Salvar como favorito costuma funcionar.
Ações que usam a área de transferência exigem HTTPS ou permissão.
Alterações visuais desaparecem ao recarregar a página.
Os códigos desta lista não enviam conteúdo a terceiros, exceto quando isso está explicitamente indicado.

Leitura e aparência

1. Remover sobreposições fixas

Remove banners, modais e caixas com posição fixa ou sticky que ocupem parte relevante da tela.

javascript:(()=>{document.querySelectorAll('body *').forEach(e=>{const s=getComputedStyle(e),r=e.getBoundingClientRect();if((s.position==='fixed'||s.position==='sticky')&&r.width>innerWidth*.25&&r.height>40)e.remove()})})()

2. Modo de leitura simples

Mantém o conteúdo principal e aplica tipografia confortável. Recarregue para restaurar.

javascript:(()=>{const m=document.querySelector('article,main,[role="main"]')||document.body,c=m.cloneNode(true);document.body.innerHTML='';document.body.append(c);document.body.style='max-width:760px;margin:40px auto;padding:0 20px;font:20px/1.7 system-ui;color:#222;background:#fafafa';document.querySelectorAll('script,style,nav,aside,form,button').forEach(e=>e.remove())})()

3. Alternar modo escuro

Inverte a página e corrige imagens e vídeos para não ficarem negativos.

javascript:(()=>{const id='bm-dark';let s=document.getElementById(id);if(s)s.remove();else{ s=document.createElement('style');s.id=id;s.textContent='html{filter:invert(1) hue-rotate(180deg)!important;background:#111}img,video,picture,canvas,svg{filter:invert(1) hue-rotate(180deg)!important}';document.head.append(s)}})()

4. Alternar escala de cinza

Útil para avaliar hierarquia visual sem depender de cores.

javascript:(()=>{document.documentElement.style.filter=document.documentElement.style.filter?'':'grayscale(1)'})()

5. Aumentar texto

Aumenta em 10% o tamanho-base da página a cada clique.

javascript:(()=>{const h=document.documentElement,v=parseFloat(getComputedStyle(h).fontSize);h.style.fontSize=(v*1.1)+'px'})()

6. Diminuir texto

Reduz em 10% o tamanho-base da página.

javascript:(()=>{const h=document.documentElement,v=parseFloat(getComputedStyle(h).fontSize);h.style.fontSize=(v*.9)+'px'})()

7. Aumentar espaçamento de linhas

Aplica altura de linha mínima de 1,8 em parágrafos, listas e blocos de texto.

javascript:(()=>{document.querySelectorAll('p,li,blockquote,dd,dt').forEach(e=>e.style.lineHeight='1.8')})()

8. Limitar largura de leitura

Centraliza o conteúdo e limita a largura para linhas mais confortáveis.

javascript:(()=>{const e=document.querySelector('article,main,[role="main"]')||document.body;e.style.maxWidth='760px';e.style.margin='32px auto';e.style.padding='0 20px'})()

9. Ocultar imagens

Esconde imagens, vídeos, SVG e elementos de fundo para leitura com menos distrações.

javascript:(()=>{const id='bm-hide-media',old=document.getElementById(id);if(old)old.remove();else{const s=document.createElement('style');s.id=id;s.textContent='img,picture,video,svg,canvas{display:none!important}*{background-image:none!important}';document.head.append(s)}})()

10. Destacar links visitados

Marca links que o navegador reconhece como visitados.

javascript:(()=>{const s=document.createElement('style');s.textContent='a:visited{background:#ffea70!important;color:#4b0082!important;outline:2px solid #ff9800!important}';document.head.append(s)})()

Pesquisa e investigação

11. Pesquisar seleção no Google

Pesquisa o texto selecionado; se não houver seleção, pergunta o termo. A consulta será enviada ao Google.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Pesquisar no Google:');if(q)open('https://www.google.com/search?q='+encodeURIComponent(q),'_blank','noopener')})()

12. Pesquisar seleção no DuckDuckGo

Alternativa de busca com maior foco em privacidade. A consulta será enviada ao DuckDuckGo.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Pesquisar no DuckDuckGo:');if(q)open('https://duckduckgo.com/?q='+encodeURIComponent(q),'_blank','noopener')})()

13. Pesquisar na Wikipédia em português

Busca a seleção ou um termo informado. A consulta será enviada à Wikipédia.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Pesquisar na Wikipédia:');if(q)open('https://pt.wikipedia.org/w/index.php?search='+encodeURIComponent(q),'_blank','noopener')})()

14. Pesquisar no Google Scholar

Envia o trecho selecionado ao Google Acadêmico.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Pesquisar no Google Scholar:');if(q)open('https://scholar.google.com/scholar?q='+encodeURIComponent(q),'_blank','noopener')})()

15. Traduzir página

Abre a URL atual no Google Translate. A URL será enviada ao Google.

javascript:(()=>{open('https://translate.google.com/translate?sl=auto&tl=pt&u='+encodeURIComponent(location.href),'_blank','noopener')})()

16. Wayback Machine

Procura capturas arquivadas da página atual. A URL será enviada ao Internet Archive.

javascript:(()=>{open('https://web.archive.org/web/*/'+encodeURIComponent(location.href),'_blank','noopener')})()

17. Arquivar no Wayback Machine

Solicita uma nova captura. A URL será enviada ao Internet Archive.

javascript:(()=>{open('https://web.archive.org/save/'+location.href,'_blank','noopener')})()

18. Pesquisar somente neste site

Pesquisa no Google usando site:dominio. A consulta e o domínio serão enviados ao Google.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Pesquisar neste site:');if(q)open('https://www.google.com/search?q='+encodeURIComponent('site:'+location.hostname+' '+q),'_blank','noopener')})()

19. Definir palavra selecionada

Pesquisa a definição do trecho selecionado. A consulta será enviada ao Google.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Palavra ou expressão:');if(q)open('https://www.google.com/search?q='+encodeURIComponent('define: '+q),'_blank','noopener')})()

20. Pesquisar frase exata

Coloca a seleção entre aspas para localizar ocorrências exatas. A consulta será enviada ao Google.

javascript:(()=>{const q=getSelection().toString().trim()||prompt('Frase exata:');if(q)open('https://www.google.com/search?q='+encodeURIComponent('"'+q+'"'),'_blank','noopener')})()

URLs, links e compartilhamento

21. Copiar título e URL em Markdown

Gera [Título](URL) e copia para a área de transferência.

javascript:(()=>{const t='['+document.title.replace(/[\[\]]/g,'')+']('+location.href+')';navigator.clipboard.writeText(t).then(()=>alert('Markdown copiado'))})()

22. Copiar URL

Copia o endereço completo da página.

javascript:(()=>{navigator.clipboard.writeText(location.href).then(()=>alert('URL copiada'))})()

23. Copiar título

Copia apenas o título da página.

javascript:(()=>{navigator.clipboard.writeText(document.title).then(()=>alert('Título copiado'))})()

24. Copiar URL canônica

Usa rel=canonical quando disponível e recorre à URL atual.

javascript:(()=>{const u=document.querySelector('link[rel="canonical"]')?.href||location.href;navigator.clipboard.writeText(u).then(()=>alert(u))})()

25. Remover parâmetros de rastreamento

Limpa UTM, fbclid, gclid, mc_* e outros parâmetros comuns da URL, sem recarregar.

javascript:(()=>{const u=new URL(location.href),rx=/^(utm_|fbclid$|gclid$|dclid$|msclkid$|mc_|igshid$|ref_src$|ref_url$)/i;[...u.searchParams.keys()].forEach(k=>{if(rx.test(k))u.searchParams.delete(k)});history.replaceState(null,'',u);navigator.clipboard.writeText(u.href).then(()=>alert('URL limpa e copiada'))})()

26. Listar todos os links

Abre uma nova página local com texto e destino de cada link.

javascript:(()=>{const a=[...document.links].map((e,i)=>`${i+1}. ${e.innerText.trim()||'[sem texto]'}\n${e.href}`).join('\n\n'),w=open();w.document.write('<pre style="white-space:pre-wrap;font:14px/1.5 monospace"></pre>');w.document.querySelector('pre').textContent=a})()

27. Abrir links da seleção

Abre até 20 links contidos no trecho selecionado, após confirmação.

javascript:(()=>{const s=getSelection();if(!s.rangeCount)return;const d=document.createElement('div');d.append(s.getRangeAt(0).cloneContents());const a=[...d.querySelectorAll('a[href]')].slice(0,20);if(a.length&&confirm('Abrir '+a.length+' links?'))a.forEach(e=>open(e.href,'_blank','noopener'))})()

28. Destacar links externos

Contorna links que apontam para outro domínio.

javascript:(()=>{document.querySelectorAll('a[href]').forEach(a=>{try{if(new URL(a.href).hostname!==location.hostname)a.style.outline='3px solid #ff5722'}catch{}})})()

29. Mostrar destinos dos links

Acrescenta a URL ao lado de cada link visível.

javascript:(()=>{document.querySelectorAll('a[href]').forEach(a=>{if(!a.dataset.bmHref){const s=document.createElement('small');s.textContent=' ['+a.href+']';s.style='color:#555;font:11px monospace';a.after(s);a.dataset.bmHref='1'}})})()

30. Gerar QR Code da URL

Abre um QR Code no QuickChart. A URL atual será enviada ao serviço.

javascript:(()=>{open('https://quickchart.io/qr?size=400&text='+encodeURIComponent(location.href),'_blank','noopener')})()

Desenvolvimento web e inspeção

31. Contornar todos os elementos

Mostra as caixas que compõem o layout.

javascript:(()=>{const id='bm-outline',o=document.getElementById(id);if(o)o.remove();else{const s=document.createElement('style');s.id=id;s.textContent='*{outline:1px solid rgba(255,0,0,.35)!important}';document.head.append(s)}})()

32. Mostrar nomes das tags

Adiciona uma etiqueta com o nome da tag em cada elemento.

javascript:(()=>{const s=document.createElement('style');s.textContent='*{position:relative!important}*:hover:before{content:attr(data-bm-tag);position:absolute;z-index:2147483647;background:#111;color:#fff;font:11px monospace;padding:2px 4px;top:0;left:0}';document.querySelectorAll('*').forEach(e=>e.dataset.bmTag=e.tagName.toLowerCase());document.head.append(s)})()

33. Relatório de títulos

Abre a hierarquia H1–H6 com indentação.

javascript:(()=>{const t=[...document.querySelectorAll('h1,h2,h3,h4,h5,h6')].map(h=>'  '.repeat(+h.tagName[1]-1)+h.tagName+': '+h.innerText.trim()).join('\n'),w=open();w.document.write('<pre></pre>');w.document.querySelector('pre').textContent=t||'Nenhum título encontrado'})()

34. Relatório de landmarks

Lista header, nav, main, aside, footer e roles equivalentes.

javascript:(()=>{const q='header,nav,main,aside,footer,search,[role]',r=[...document.querySelectorAll(q)].map((e,i)=>`${i+1}. ${e.tagName.toLowerCase()} role=${e.getAttribute('role')||'-'} label=${e.getAttribute('aria-label')||'-'}`).join('\n');alert(r||'Nenhum landmark encontrado')})()

35. Relatório de textos alternativos

Lista cada imagem, seu alt e parte do endereço.

javascript:(()=>{const r=[...document.images].map((e,i)=>`${i+1}. alt=${e.hasAttribute('alt')?JSON.stringify(e.alt):'[AUSENTE]'}\n${e.currentSrc||e.src}`).join('\n\n'),w=open();w.document.write('<pre style="white-space:pre-wrap"></pre>');w.document.querySelector('pre').textContent=r||'Sem imagens'})()

36. Links sem nome acessível

Destaca links sem texto, aria-label, imagem com alt ou title.

javascript:(()=>{let n=0;document.querySelectorAll('a[href]').forEach(a=>{const x=(a.innerText||a.getAttribute('aria-label')||a.getAttribute('title')||a.querySelector('img')?.alt||'').trim();if(!x){a.style.outline='4px solid red';n++}});alert(n+' links sem nome acessível')})()

37. Controles de formulário sem rótulo

Destaca inputs, selects e textareas que não parecem possuir label.

javascript:(()=>{let n=0;document.querySelectorAll('input:not([type="hidden"]),select,textarea').forEach(e=>{const ok=e.labels?.length||e.getAttribute('aria-label')||e.getAttribute('aria-labelledby')||e.title;if(!ok){e.style.outline='4px solid #f00';n++}});alert(n+' controles sem rótulo detectável')})()

38. IDs duplicados

Marca elementos cujo atributo id aparece mais de uma vez.

javascript:(()=>{const m={};document.querySelectorAll('[id]').forEach(e=>(m[e.id]??=[]).push(e));const d=Object.entries(m).filter(([,v])=>v.length>1);d.forEach(([,v])=>v.forEach(e=>e.style.outline='4px solid magenta'));alert(d.length?d.map(([k,v])=>k+' × '+v.length).join('\n'):'Nenhum ID duplicado')})()

39. Metadados da página

Mostra título, descrição, canonical, idioma, charset e viewport.

javascript:(()=>{const g=s=>document.querySelector(s)?.content||document.querySelector(s)?.href||'-';alert(`Título: ${document.title}\nDescrição: ${g('meta[name="description"]')}\nCanonical: ${g('link[rel="canonical"]')}\nIdioma: ${document.documentElement.lang||'-'}\nCharset: ${document.characterSet}\nViewport: ${g('meta[name="viewport"]')}`)})()

40. Resumo SEO

Conta H1, títulos, imagens sem alt, links e palavras.

javascript:(()=>{const txt=(document.querySelector('main,article')||document.body).innerText.trim(),w=txt?txt.split(/\s+/).length:0;alert(`Título (${document.title.length}): ${document.title}\nH1: ${document.querySelectorAll('h1').length}\nH2: ${document.querySelectorAll('h2').length}\nPalavras: ${w}\nLinks: ${document.links.length}\nImagens sem alt: ${document.querySelectorAll('img:not([alt])').length}`)})()

41. Visualizar JSON-LD

Reúne blocos de dados estruturados em uma nova aba.

javascript:(()=>{const a=[...document.querySelectorAll('script[type="application/ld+json"]')].map(s=>s.textContent.trim()).join('\n\n---\n\n'),w=open();w.document.write('<pre style="white-space:pre-wrap"></pre>');w.document.querySelector('pre').textContent=a||'Nenhum JSON-LD'})()

42. Visualizar Open Graph

Lista metatags Open Graph e Twitter Cards.

javascript:(()=>{const a=[...document.querySelectorAll('meta[property^="og:"],meta[name^="twitter:"]')].map(m=>(m.getAttribute('property')||m.name)+': '+m.content).join('\n');alert(a||'Nenhuma metatag social')})()

43. Listar cores CSS usadas

Coleta cores computadas de texto, fundo e borda.

javascript:(()=>{const c=new Set;document.querySelectorAll('body *').forEach(e=>{const s=getComputedStyle(e);[s.color,s.backgroundColor,s.borderTopColor].forEach(v=>{if(v&&!/rgba?\(0,\s*0,\s*0,\s*0\)/.test(v))c.add(v)})});alert([...c].sort().join('\n'))})()

44. Listar fontes usadas

Mostra famílias tipográficas computadas e quantas vezes aparecem.

javascript:(()=>{const m={};document.querySelectorAll('body *').forEach(e=>{const f=getComputedStyle(e).fontFamily;m[f]=(m[f]||0)+1});alert(Object.entries(m).sort((a,b)=>b[1]-a[1]).map(([f,n])=>`${n} × ${f}`).join('\n'))})()

45. Listar maiores z-index

Encontra elementos posicionados e ordena pelos maiores valores.

javascript:(()=>{const a=[...document.querySelectorAll('body *')].map(e=>[e,getComputedStyle(e)]).filter(([,s])=>s.position!=='static'&&s.zIndex!=='auto').map(([e,s])=>({tag:e.tagName,id:e.id,z:+s.zIndex||0})).sort((a,b)=>b.z-a.z).slice(0,30);alert(a.map(x=>`${x.z} ${x.tag}${x.id?'#'+x.id:''}`).join('\n')||'Nenhum z-index explícito')})()

46. Dimensões da viewport e documento

Mostra tamanho visível, página total, DPR e rolagem atual.

javascript:(()=>{alert(`Viewport: ${innerWidth}×${innerHeight}\nDocumento: ${document.documentElement.scrollWidth}×${document.documentElement.scrollHeight}\nDPR: ${devicePixelRatio}\nScroll: ${scrollX}, ${scrollY}`)})()

47. Medir elemento clicado

Após ativar, clique em um elemento para ver posição e dimensões. Escape cancela.

javascript:(()=>{const f=e=>{e.preventDefault();e.stopPropagation();const r=e.target.getBoundingClientRect();alert(`${e.target.tagName.toLowerCase()}\n${Math.round(r.width)}×${Math.round(r.height)}\nx=${Math.round(r.x)} y=${Math.round(r.y)}`);removeEventListener('click',f,true)};addEventListener('click',f,true);alert('Clique no elemento que deseja medir')})()

48. Editar página visualmente

Alterna contenteditable em toda a página. Serve para protótipos; não salva no servidor.

javascript:(()=>{const on=document.body.contentEditable==='true';document.body.contentEditable=on?'false':'true';document.designMode=on?'off':'on';alert(on?'Edição desativada':'Página editável')})()

49. Remover folhas de estilo

Desativa CSS externo e remove estilos internos. Recarregue para restaurar.

javascript:(()=>{document.querySelectorAll('link[rel="stylesheet"],style').forEach(e=>e.remove());document.querySelectorAll('[style]').forEach(e=>e.removeAttribute('style'))})()

50. Desativar animações

Interrompe transições, animações e rolagem suave.

javascript:(()=>{const s=document.createElement('style');s.textContent='*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}';document.head.append(s);document.getAnimations?.().forEach(a=>a.cancel())})()

Acessibilidade e usabilidade

51. Destacar imagens sem `alt`

Contorna em vermelho apenas imagens sem o atributo.

javascript:(()=>{const a=document.querySelectorAll('img:not([alt])');a.forEach(e=>e.style.outline='5px solid red');alert(a.length+' imagens sem alt')})()

52. Destacar botões sem nome

Procura botões sem texto ou rótulo ARIA.

javascript:(()=>{let n=0;document.querySelectorAll('button,[role="button"],input[type="button"],input[type="submit"]').forEach(e=>{const x=(e.innerText||e.value||e.getAttribute('aria-label')||e.getAttribute('title')||'').trim();if(!x){e.style.outline='5px solid red';n++}});alert(n+' botões sem nome')})()

53. Mostrar ordem de tabulação

Numera elementos focáveis na ordem aproximada do teclado.

javascript:(()=>{const q='a[href],button,input:not([type="hidden"]),select,textarea,[tabindex]:not([tabindex="-1"])',a=[...document.querySelectorAll(q)].map((e,i)=>({e,i,t:e.tabIndex})).filter(x=>!x.e.disabled&&x.e.offsetParent);a.sort((x,y)=>x.t>0&&y.t>0?x.t-y.t:x.t>0?-1:y.t>0?1:x.i-y.i).forEach((x,i)=>{const b=document.createElement('b');b.textContent=i+1;b.style='position:absolute;z-index:2147483647;background:#000;color:#fff;padding:2px 5px;border-radius:50%;font:12px sans-serif';x.e.before(b)})})()

54. Verificar saltos em títulos

Marca títulos que pulam um nível, como H2 seguido de H4.

javascript:(()=>{let p=0,n=0;document.querySelectorAll('h1,h2,h3,h4,h5,h6').forEach(h=>{const v=+h.tagName[1];if(p&&v>p+1){h.style.outline='5px solid red';n++}p=v});alert(n+' possíveis saltos de nível')})()

55. Mostrar roles ARIA

Rotula elementos que possuem role.

javascript:(()=>{document.querySelectorAll('[role]').forEach(e=>{const b=document.createElement('span');b.textContent=' role='+e.getAttribute('role')+' ';b.style='background:#6a1b9a;color:#fff;font:12px monospace';e.prepend(b)})})()

56. Mostrar `aria-label`

Exibe rótulos ARIA diretamente na página.

javascript:(()=>{document.querySelectorAll('[aria-label]').forEach(e=>{const b=document.createElement('span');b.textContent=' aria-label="'+e.getAttribute('aria-label')+'" ';b.style='background:#004d40;color:#fff;font:11px monospace';e.after(b)})})()

57. Verificar idioma da página

Mostra lang e alerta se estiver ausente.

javascript:(()=>{const l=document.documentElement.getAttribute('lang');alert(l?'Idioma declarado: '+l:'ATENÇÃO: elemento html sem atributo lang')})()

58. Destacar campos obrigatórios

Marca controles com required ou aria-required=true.

javascript:(()=>{const a=document.querySelectorAll('[required],[aria-required="true"]');a.forEach(e=>e.style.outline='4px solid #ff9800');alert(a.length+' campos obrigatórios')})()

59. Verificação aproximada de contraste

Marca texto cujo contraste calculado contra o fundo imediato seja menor que 4,5:1. Gradientes, transparências e imagens podem gerar falsos resultados.

javascript:(()=>{const rgb=s=>(s.match(/\d+(\.\d+)?/g)||[0,0,0]).slice(0,3).map(Number),lum=a=>{a=a.map(v=>(v/=255)<=.03928?v/12.92:((v+.055)/1.055)**2.4);return .2126*a[0]+.7152*a[1]+.0722*a[2]},rat=(a,b)=>(Math.max(a,b)+.05)/(Math.min(a,b)+.05);let n=0;document.querySelectorAll('body *').forEach(e=>{if(!e.innerText.trim()||!e.offsetParent)return;const s=getComputedStyle(e),r=rat(lum(rgb(s.color)),lum(rgb(s.backgroundColor)));if(r<4.5&&s.backgroundColor!=='rgba(0, 0, 0, 0)'){e.style.outline='3px solid red';n++}});alert(n+' elementos com contraste aproximado abaixo de 4,5:1')})()

60. Testar dependência de cor

Reduz bastante a saturação para revelar informações que dependam apenas de cor. É uma triagem visual, não uma simulação clínica de daltonismo.

javascript:(()=>{document.documentElement.style.filter=document.documentElement.style.filter?'':'saturate(.15)'})()

61. Aplicar espaçamento acessível de texto

Usa valores próximos ao teste de text spacing da WCAG.

javascript:(()=>{const s=document.createElement('style');s.textContent='body{line-height:1.5!important}p{margin-bottom:2em!important;letter-spacing:.12em!important;word-spacing:.16em!important}';document.head.append(s)})()

62. Visualização somente texto

Oculta mídia, navegação, formulários e elementos sem texto.

javascript:(()=>{const s=document.createElement('style');s.textContent='img,video,audio,svg,canvas,iframe,nav,aside,form{display:none!important}body{max-width:800px!important;margin:auto!important;font:18px/1.6 system-ui!important}';document.head.append(s)})()

63. Mostrar teclas de acesso

Exibe elementos que possuem accesskey.

javascript:(()=>{const a=document.querySelectorAll('[accesskey]');a.forEach(e=>{const b=document.createElement('kbd');b.textContent=' accesskey='+e.accessKey+' ';b.style='background:#222;color:#fff';e.after(b)});alert(a.length+' accesskeys')})()

64. Destacar regiões roláveis

Contorna áreas internas com rolagem, úteis para investigar armadilhas de teclado.

javascript:(()=>{let n=0;document.querySelectorAll('body *').forEach(e=>{const s=getComputedStyle(e);if((/auto|scroll/.test(s.overflow+s.overflowY+s.overflowX))&&(e.scrollHeight>e.clientHeight||e.scrollWidth>e.clientWidth)){e.style.outline='4px dashed #2196f3';n++}});alert(n+' regiões roláveis')})()

65. Resumo rápido de acessibilidade

Conta problemas estruturais simples; não substitui auditoria humana.

javascript:(()=>{const q=s=>document.querySelectorAll(s).length;alert(`Idioma ausente: ${document.documentElement.lang?0:1}\nH1: ${q('h1')}\nImagens sem alt: ${q('img:not([alt])')}\nInputs sem label/ARIA: ${[...document.querySelectorAll('input:not([type="hidden"]),select,textarea')].filter(e=>!e.labels?.length&&!e.getAttribute('aria-label')&&!e.getAttribute('aria-labelledby')).length}\nLinks vazios: ${[...document.links].filter(a=>!(a.innerText||a.getAttribute('aria-label')||a.querySelector('img')?.alt||'').trim()).length}`)})()

Imagens, áudio e vídeo

66. Listar dimensões das imagens

Mostra dimensões naturais, dimensões exibidas e URL.

javascript:(()=>{const r=[...document.images].map((e,i)=>`${i+1}. natural=${e.naturalWidth}×${e.naturalHeight} exibida=${Math.round(e.width)}×${Math.round(e.height)}\n${e.currentSrc||e.src}`).join('\n\n'),w=open();w.document.write('<pre style="white-space:pre-wrap"></pre>');w.document.querySelector('pre').textContent=r||'Sem imagens'})()

67. Abrir imagem clicada

Ative e clique em uma imagem para abrir o arquivo original.

javascript:(()=>{const f=e=>{const i=e.target.closest('img');if(!i)return;e.preventDefault();e.stopPropagation();removeEventListener('click',f,true);open(i.currentSrc||i.src,'_blank','noopener')};addEventListener('click',f,true);alert('Clique na imagem')})()

68. Copiar URLs de todas as imagens

Copia endereços únicos separados por linha.

javascript:(()=>{const a=[...new Set([...document.images].map(i=>i.currentSrc||i.src).filter(Boolean))];navigator.clipboard.writeText(a.join('\n')).then(()=>alert(a.length+' URLs copiadas'))})()

69. Mostrar imagens de fundo

Abre uma lista com URLs encontradas em background-image.

javascript:(()=>{const a=new Set;document.querySelectorAll('body *').forEach(e=>{const v=getComputedStyle(e).backgroundImage;for(const m of v.matchAll(/url\(["']?(.+?)["']?\)/g))a.add(m[1])});const w=open();w.document.write('<pre style="white-space:pre-wrap"></pre>');w.document.querySelector('pre').textContent=[...a].join('\n')||'Nenhuma imagem de fundo'})()

70. Pausar todas as mídias

Pausa vídeos e áudios da página.

javascript:(()=>{document.querySelectorAll('video,audio').forEach(m=>m.pause())})()

71. Silenciar ou reativar tudo

Alterna muted em vídeos e áudios.

javascript:(()=>{const a=[...document.querySelectorAll('video,audio')],v=!a.every(m=>m.muted);a.forEach(m=>m.muted=v);alert(v?'Mídia silenciada':'Som reativado')})()

72. Velocidade 1,5×

Define todos os players HTML5 para 1,5×.

javascript:(()=>{document.querySelectorAll('video,audio').forEach(m=>m.playbackRate=1.5);alert('Velocidade: 1,5×')})()

73. Velocidade 2×

Define todos os players HTML5 para 2×.

javascript:(()=>{document.querySelectorAll('video,audio').forEach(m=>m.playbackRate=2);alert('Velocidade: 2×')})()

74. Picture-in-Picture

Coloca o primeiro vídeo compatível em janela flutuante.

javascript:(()=>{const v=document.querySelector('video');if(!v)return alert('Nenhum vídeo');if(document.pictureInPictureElement)document.exitPictureInPicture();else if(v.requestPictureInPicture)v.requestPictureInPicture();else alert('Picture-in-Picture indisponível')})()

75. Listar fontes de mídia

Reúne URLs de video, audio e source; não contorna DRM nem blobs protegidos.

javascript:(()=>{const a=[...new Set([...document.querySelectorAll('video,audio,source')].flatMap(e=>[e.currentSrc,e.src]).filter(Boolean))],w=open();w.document.write('<pre style="white-space:pre-wrap"></pre>');w.document.querySelector('pre').textContent=a.join('\n')||'Nenhuma URL direta de mídia'})()

Texto e transformação de dados

76. Contar palavras

Conta palavras da seleção ou, sem seleção, do conteúdo principal.

javascript:(()=>{const t=getSelection().toString().trim()||(document.querySelector('main,article')||document.body).innerText.trim();alert(`${t?t.split(/\s+/).length:0} palavras\n${t.length} caracteres`)})()

77. Contar caracteres da seleção

Mostra caracteres totais, sem espaços e linhas.

javascript:(()=>{const t=getSelection().toString();alert(`Caracteres: ${t.length}\nSem espaços: ${t.replace(/\s/g,'').length}\nLinhas: ${t?t.split(/\r?\n/).length:0}`)})()

78. Copiar seleção em MAIÚSCULAS

javascript:(()=>{const t=getSelection().toString();if(t)navigator.clipboard.writeText(t.toLocaleUpperCase()).then(()=>alert('Copiado'))})()

79. Copiar seleção em minúsculas

javascript:(()=>{const t=getSelection().toString();if(t)navigator.clipboard.writeText(t.toLocaleLowerCase()).then(()=>alert('Copiado'))})()

80. Copiar seleção em Formato de Título

Capitaliza palavras, com resultado simples e não linguístico.

javascript:(()=>{const t=getSelection().toString().toLocaleLowerCase().replace(/\b\p{L}/gu,c=>c.toLocaleUpperCase());if(t)navigator.clipboard.writeText(t).then(()=>alert('Copiado'))})()

81. Limpar espaços da seleção

Reduz espaços repetidos e remove espaços no início e fim.

javascript:(()=>{const t=getSelection().toString().replace(/[ \t]+/g,' ').replace(/ *\n */g,'\n').trim();if(t)navigator.clipboard.writeText(t).then(()=>alert('Texto limpo copiado'))})()

82. Aplicar ROT13

Codifica ou decodifica letras da seleção usando ROT13.

javascript:(()=>{const t=getSelection().toString().replace(/[a-z]/gi,c=>String.fromCharCode((c<='Z'?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26));if(t)navigator.clipboard.writeText(t).then(()=>alert('ROT13 copiado'))})()

83. Ordenar linhas selecionadas

Ordena alfabeticamente e copia.

javascript:(()=>{const t=getSelection().toString().split(/\r?\n/).map(s=>s.trim()).filter(Boolean).sort((a,b)=>a.localeCompare(b)).join('\n');if(t)navigator.clipboard.writeText(t).then(()=>alert('Linhas ordenadas'))})()

84. Extrair endereços de e-mail

Procura e-mails visíveis na página, remove duplicatas e copia localmente.

javascript:(()=>{const a=[...new Set((document.body.innerText.match(/[\w.+-]+@[\w.-]+\.[a-z]{2,}/gi)||[]).map(s=>s.toLowerCase()))];navigator.clipboard.writeText(a.join('\n')).then(()=>alert(a.length+' e-mails copiados'))})()

85. Tabela clicada para CSV

Ative e clique em uma tabela. O CSV será copiado para a área de transferência.

javascript:(()=>{const f=e=>{const t=e.target.closest('table');if(!t)return;e.preventDefault();removeEventListener('click',f,true);const csv=[...t.rows].map(r=>[...r.cells].map(c=>'"'+c.innerText.trim().replace(/"/g,'""')+'"').join(',')).join('\n');navigator.clipboard.writeText(csv).then(()=>alert('CSV copiado'))};addEventListener('click',f,true);alert('Clique na tabela')})()

Privacidade e segurança

86. Listar domínios de terceiros

Reúne domínios usados em links, scripts, imagens, iframes, áudio e vídeo.

javascript:(()=>{const s=new Set;document.querySelectorAll('[src],[href]').forEach(e=>{const u=e.src||e.href;try{const h=new URL(u,location.href).hostname;if(h&&h!==location.hostname)s.add(h)}catch{}});alert([...s].sort().join('\n')||'Nenhum domínio de terceiro encontrado no DOM')})()

87. Detectar conteúdo misto

Em páginas HTTPS, procura recursos HTTP visíveis no DOM.

javascript:(()=>{const a=[...document.querySelectorAll('[src],[href]')].map(e=>e.src||e.href).filter(u=>location.protocol==='https:'&&u?.startsWith('http:'));alert(a.length?a.join('\n'):'Nenhum recurso HTTP explícito em página HTTPS')})()

88. Detectar formulários inseguros

Marca formulários de páginas HTTPS que enviam dados para um destino HTTP.

javascript:(()=>{let n=0;document.forms&&[...document.forms].forEach(f=>{const u=new URL(f.action||location.href,location.href);if(location.protocol==='https:'&&u.protocol!=='https:'){f.style.outline='5px solid red';n++}});alert(n+' formulários enviando de HTTPS para destino inseguro')})()

89. Listar nomes de cookies acessíveis

Mostra apenas nomes, nunca valores. Cookies HttpOnly não são visíveis ao JavaScript.

javascript:(()=>{const a=document.cookie?document.cookie.split(';').map(x=>x.split('=')[0].trim()).filter(Boolean):[];alert(a.length?a.join('\n'):'Nenhum cookie acessível ao JavaScript')})()

90. Listar chaves do localStorage

Não mostra valores para reduzir exposição acidental.

javascript:(()=>{try{alert(localStorage.length?[...Array(localStorage.length)].map((_,i)=>localStorage.key(i)).join('\n'):'localStorage vazio')}catch(e){alert('localStorage indisponível: '+e.message)}})()

91. Listar chaves do sessionStorage

javascript:(()=>{try{alert(sessionStorage.length?[...Array(sessionStorage.length)].map((_,i)=>sessionStorage.key(i)).join('\n'):'sessionStorage vazio')}catch(e){alert('sessionStorage indisponível: '+e.message)}})()

92. Mostrar CSP e referrer declarados em `<meta>`

Cabeçalhos HTTP não ficam todos disponíveis ao JavaScript; isto mostra apenas CSP e política de referrer quando declaradas no HTML.

javascript:(()=>{const q='meta[http-equiv="Content-Security-Policy" i],meta[name="referrer" i]',a=[...document.querySelectorAll(q)].map(m=>(m.httpEquiv||m.name)+': '+m.content);alert(a.join('\n\n')||'Nenhuma CSP ou política de referrer declarada por meta')})()

93. Mostrar informações de referência

Exibe URL atual, origem e document.referrer.

javascript:(()=>{alert(`URL: ${location.href}\nOrigem: ${location.origin}\nReferrer: ${document.referrer||'[vazio]'}\nReferrer policy: ${document.querySelector('meta[name="referrer"]')?.content||'[não declarada em meta]'}`)})()

94. SHA-256 da seleção

Calcula localmente o hash SHA-256 do texto selecionado.

javascript:(()=>{const t=getSelection().toString()||prompt('Texto para SHA-256:');if(t==null)return;crypto.subtle.digest('SHA-256',new TextEncoder().encode(t)).then(b=>alert([...new Uint8Array(b)].map(x=>x.toString(16).padStart(2,'0')).join('')))})()

95. Destacar links com esquemas ativos

Marca links javascript: e data:, que merecem inspeção antes do clique.

javascript:(()=>{const a=[...document.querySelectorAll('a[href]')].filter(e=>/^(javascript|data):/i.test(e.getAttribute('href').trim()));a.forEach(e=>e.style.outline='5px solid red');alert(a.length+' links javascript: ou data:')})()

Produtividade, validação e arquivamento

96. Abrir no PageSpeed Insights

Envia a URL atual ao serviço do Google para auditoria de desempenho.

javascript:(()=>{open('https://pagespeed.web.dev/analysis?url='+encodeURIComponent(location.href),'_blank','noopener')})()

97. Validar HTML no W3C

Envia a URL atual ao validador oficial.

javascript:(()=>{open('https://validator.w3.org/nu/?doc='+encodeURIComponent(location.href),'_blank','noopener')})()

98. Validar CSS no W3C

Envia a URL atual ao serviço de validação CSS.

javascript:(()=>{open('https://jigsaw.w3.org/css-validator/validator?uri='+encodeURIComponent(location.href),'_blank','noopener')})()

99. Imprimir página limpa

Oculta navegação, laterais, formulários e elementos fixos antes de abrir a impressão.

javascript:(()=>{const s=document.createElement('style');s.textContent='@media print{nav,aside,form,button,[role="dialog"],[style*="position: fixed"],[style*="position:fixed"]{display:none!important}body{background:#fff!important;color:#000!important}a{color:#000!important}}';document.head.append(s);print()})()

100. Baixar nota Markdown da página

Cria um arquivo com título, URL canônica, data e texto selecionado. Tudo acontece localmente.

javascript:(()=>{const u=document.querySelector('link[rel="canonical"]')?.href||location.href,s=getSelection().toString().trim(),d=new Date().toISOString(),txt=`# ${document.title}\n\n- Fonte: ${u}\n- Capturado em: ${d}\n\n${s?'> '+s.replace(/\n/g,'\n> ')+'\n\n':''}## Notas\n\n`;const b=new Blob([txt],{type:'text/markdown;charset=utf-8'}),a=document.createElement('a');a.href=URL.createObjectURL(b);a.download=(document.title.replace(/[\\/:*?"<>|]+/g,'-').slice(0,80)||'nota')+'.md';a.click();setTimeout(()=>URL.revokeObjectURL(a.href),1000)})()

Compatibilidade e limitações

Chrome, Chromium e Edge

Funcionam bem em páginas HTTP/HTTPS comuns. A área de transferência pode exigir HTTPS. Páginas internas, Chrome Web Store e alguns leitores embutidos bloqueiam execução.

Firefox

Oferece boa compatibilidade com bookmarklets. Picture-in-Picture, clipboard e algumas APIs podem depender de permissão ou gesto do usuário.

Safari

A maioria dos bookmarklets simples funciona. APIs recentes e bloqueios de pop-up podem exigir ajustes. No iPhone e iPad, normalmente é preciso criar um favorito comum e depois editar sua URL.

CSP

Uma CSP forte pode bloquear javascript: ou estilos injetados. Mesmo quando o código principal executa, recursos externos não autorizados podem falhar. Esta coleção evita carregar scripts remotos justamente para reduzir riscos e incompatibilidades.

Páginas construídas com iframes

O bookmarklet atua no documento principal. A política de mesma origem impede acessar o conteúdo de iframes pertencentes a outros domínios.

Recomendações práticas

Comece com 10: itens 1, 2, 11, 16, 21, 25, 33, 50, 76 e 100.
Crie uma pasta “Bookmarklets” na barra de favoritos.
Prefixe nomes por grupo: Ler —, Dev —, A11y — e Mídia —.
Guarde uma cópia deste arquivo; sincronizadores de navegador podem alterar ou remover URLs JavaScript.
Teste bookmarklets de inspeção em um site local antes de usá-los em produção.
Recarregue a página se uma alteração visual ficar confusa.
Nunca execute um bookmarklet ofuscado ou que carregue código de domínio desconhecido.

Conclusão

Bookmarklets continuam úteis porque resolvem pequenas tarefas sem instalar extensões com acesso permanente ao histórico e a todas as páginas. Eles são especialmente bons para leitura, pesquisa, limpeza de URLs, inspeção rápida, acessibilidade, mídia e captura de referências.

Os 100 códigos desta lista são deliberadamente pequenos, autocontidos e auditáveis. Ainda assim, devem ser tratados como programas: confira o que fazem, use somente em páginas apropriadas e lembre que políticas modernas do navegador podem impedir algumas ações.

Fontes consultadas

Nota sobre atualidade

Pesquisa concluída em 19 de julho de 2026. APIs, políticas CSP e restrições de Chrome, Firefox, Edge e Safari podem mudar. Bookmarklets devem ser testados novamente após grandes atualizações do navegador.

Related documents