Como Encontrar uma Página do tipo de Letra Utilizando o Inspecionar Elemento Ferramenta e Extensões do Browser

O sucesso do seu site depende muito de sua aparência. Ter a combinação de cores e o tema certos manterá seus visitantes em seu site por um pouco mais de tempo. Além da paleta e estrutura de cores do seu site, a fonte que você escolher também desempenha um papel essencial para manter seu público envolvido.

talvez você se deparar com um site atraente enquanto navega na web, e você quer saber quais fontes está usando. Com extensões online e a ferramenta Inspect Element integrada do seu navegador, identificar uma fonte é rápido e fácil.

como encontrar fontes usando a ferramenta Inspect Element

caso você não saiba, a ferramenta Inspect Element integrada do seu navegador permite examinar o código-fonte de um site. Você pode entender os elementos de design de um site observando seu CSS, HTML e outras informações. É uma ótima maneira de obter inspiração ao projetar seu próprio site.

o processo de identificação de uma fonte usando a ferramenta Inspect Element é bastante simples e você não precisará de nenhuma habilidade de codificação. Esta ferramenta está disponível em todos os navegadores do mercado, e cada um tem um layout semelhante.Veja como identificar uma fonte usando a ferramenta Inspect do seu navegador.

1. abra o site que deseja usar.
2. realce o texto que tem a fonte que você deseja identificar e clique com o botão direito do mouse.
3. clique em inspecionar no menu de contexto.
   

   

4. quando o menu inspecionar for aberto, clique no calculado.
5. role para baixo para encontrar a seção Família de fontes. Aqui, você pode encontrar o nome e o estilo da fonte, bem como suas dimensões.
   

   

Outras Formas de Usar a Inspecionar Ferramenta

Se você quiser uma forma mais rápida de encontrar um site do tipo de letra utilizando a Inspecionar ferramenta, tente isso em vez:

1. Abra o site que você deseja usar.
2. pressione Ctrl + Shift + C (Cmd + Shift + C no Mac).
3. passe o mouse sobre o texto para exibir o estilo, o tamanho, o código de cores e a margem da fonte.
   

   

você também pode verificar a lista de fontes usadas em uma página da Web usando a ferramenta inspecionar. Veja como fazer isso:

1. vá para a página da web.
2. abra o código-fonte pressionando Ctrl + Shift + I (Cmd + Shift + I no Mac).
3. clique na guia Rede e selecione a guia Fonte.
4. aqui, você verá uma lista de todas as fontes usadas na página da web.
   

   

para obter a lista de todas as fontes em tempo real, talvez seja necessário atualizar a página da web.

como identificar fontes usando extensões do navegador

se você quiser uma maneira mais conveniente de identificar uma fonte, você pode querer instalar uma extensão do navegador font-finding. Embora existam várias extensões de navegador que podem ajudar a detectar fontes na web, as duas mais populares são WhatFont e Font Finder.Vamos dar uma olhada no processo de identificação de fontes usando ambas as extensões.

WhatFont

WhatFont é amplamente popular para detectar rapidamente várias fontes ao mesmo tempo. Veja como usar esta ferramenta.

1. quando o WhatFont estiver ativado em seu navegador, passe o mouse sobre o texto para mostrar sua fonte.
   

   

2. depois de clicar no texto, uma janela pop-up aparecerá com o restante dos detalhes da fonte, como tamanho, cor e estilo da fonte.
   

   

3. além disso, você pode selecionar várias seções de texto simultaneamente para comparar fontes diferentes na mesma página.
   

   

Baixar: WhatFont for Chrome / Firefox / Safari(Free)

Font Finder

Font Finder também exibe detalhes da fonte quando você passa o mouse sobre qualquer texto em um site. No entanto, ele fornece muitos detalhes técnicos, por isso pode ficar um pouco confuso se você não estiver familiarizado com o web design.

dito isso, o Font Finder é mais adequado para desenvolvedores da web que desejam substituir fontes existentes por novas em tempo real. Isso facilita o teste de fontes antes de fazer alterações permanentes.

veja como testar uma fonte usando Font Finder:

1. destaque uma parte do texto da página da web.
2. clique com o botão direito nele e selecione Font Finder no menu de contexto.
   

   

3. selecione Substituir Fonte com e digite o nome da fonte. Vamos adicionar Calibri e ver como ele altera a fonte na visualização.
   

   

4. se você quiser redefinir a fonte, atualize a página.
   

   

baixar: FontFinder para Chrome / Edge / Firefox(grátis)

que tal verificar a fonte em uma imagem?

se você quiser identificar as fontes em uma imagem, as extensões do navegador e a Ferramenta de inspeção do seu navegador podem não ajudar. No entanto, você pode experimentar ferramentas on-line do inspetor de imagens, como WhatFontIs, FontSquirrel, Fontspring, WhatTheFont e muitos outros.

o processo para identificar uma fonte de uma imagem é praticamente o mesmo em todas as ferramentas. Vamos tentar identificar a fonte em uma imagem usando WhatTheFont.

1. se ainda não o fez, faça o download da imagem que deseja usar.
2. importe a imagem para WhatTheFont.
   

   

3. o WhatTheFont detectará automaticamente o texto em sua imagem. Encolha ou amplie a caixa de corte para que ela envolva a fonte que você deseja identificar. Aperte o botão de seta quando terminar.
   

   

4. WhatTheFont irá então combinar a fonte na imagem com fontes em sua galeria, e irá mostrar-lhe fontes intimamente relacionadas.
   

   

5. se você não encontrar uma boa correspondência imediatamente, você pode continuar clicando em Mostrar mais resultados para ver mais fontes relacionadas.
   

   

Detectar Fontes Da Web e Usá-Los em Seus Projetos

Fontes desempenham um papel importante no sucesso de um site ou um projeto gráfico. Se você se deparar com uma fonte envolvente enquanto navega na web, poderá detectá-la facilmente usando os métodos acima.