Existe um símbolo de glifo Unicode para representar a "Pesquisa" [fechada]

191

O Unicode possui um milhão de glifos semelhantes a ícones, mas é muito difícil pesquisar.

Existe um glifo Unicode que se parece com um "binóculo" ou "lupa"? Ou existe um símbolo usado para significar "Pesquisa", que está em Unicode?

unicode symbols html-entities

— Prasad Jadhav
fonte

possível duplicata de Qual caractere Unicode você usa no seu site? (em vez de ícones de imagem)

— Kzqai

4

Você pode usar uma sequência de glifos: U + 0053, U + 0065, U + 0061, U + 0072, U + 0063, U + 0068 8-)}

— Keith Thompson

1

Se essa outra pergunta foi encerrada, esta deveria ser a mesma.

— Ciro Santilli respondeu

Não tenho certeza se o svg faz isso por você, mas é isso que eu usei, você pode alterar a cor do atributo stroke. <svg style = "height: 1em;" viewBox = "0 0 12 13"> <g largura do traço = "2" traço = "# 999999" fill = "none"> <caminho d = "M11.29 11.71l-4-4" /> <circle cx = "5" cy = "5" r = "4" /> </g> </svg>

— galinhas

204

Há o VIDRO MAGNIFICADOR DE PONTA ESQUERDA U + 1F50D (🔍) e o VIDRO MAGNIFICADOR DE PONTA DIREITA U + 1F50D (🔎).

Você deve usar (em HTML) 🔍ou🔎

No entanto, eles não são suportados por muitas fontes (fileformat.info lista apenas algumas fontes como suportando o Codepoint com um glifo adequado).

Observe também que eles estão fora do BMP ; portanto, alguns softwares compatíveis com Unicode podem ter problemas para renderizá-los, mesmo que tenham fontes que os suportem.

Geralmente, os glifos Unicode podem ser pesquisados usando um site como fileformat.info . Isso pesquisa "apenas" nos nomes e propriedades dos glifos Unicode, mas geralmente contém metadados suficientes para permitir bons resultados de pesquisa (para esta resposta, procurei por "glass" e naveguei na lista resultante, por exemplo)

— Joachim Sauer
fonte

7

@Prasad Jadhav, a questão do suporte a Unicode é hoje um problema de fonte e é realmente uma questão diferente. Para caracteres tão raros (em fontes) como esses, uma fonte incorporada ( @font face) é provavelmente a única opção e um tanto problemática (já que o Symbola é uma fonte tão grande). Os caracteres também aparecem no Quivira (versão 3.7) e no Segoe UI Symbol (versão 5.01), mas esse ainda é um conjunto muito limitado de fontes. Quivira é uma fonte gratuita, o Segoe UI Symbol é fornecido com o Windows 7 e permite incorporação editável.

— Jukka K. Korpela

21

Posso recomendar "Gravador de telefone" U + 2315 ⌕:? É totalmente independente, mas se parece com uma lupa e parece estar incluído em fontes padrão, onde U + 1F50D e U + 1F50E não.

— Zopieux 18/06/2013

1

Arial (no Windows) também suporta a "lupa apontando esquerda"

— Spinal

1

Para os curiosos, é renderizado em cores nos Chromebooks: i.imgur.com/86b0a2o.png

— LB-- 8/15

5

Se você não quiser coloração, use o seletor de variação unicode 15 depois e ele aparecerá como 🔎︎

— pfg

123

Use o símbolo ((codificado como ⚲ou ⚲) e gire-o para obter o efeito desejado:

<div style="-webkit-transform: rotate(45deg); 
               -moz-transform: rotate(45deg); 
                 -o-transform: rotate(45deg);
                    transform: rotate(45deg);">
    &#9906;
</div>

Gira um símbolo :)

— Ricky
fonte

1

Bem, o objetivo é ter um glifo baseado em texto, e o símbolo é muito mais bonito que o unicode. +1.

— Niloct 29/01

1

@Niloct É uma resposta html. Não vejo a pergunta como específica para html. No xaml você faria algo parecido <Grid.RenderTransform><CompositeTransform Rotation="-45" /></Grid.RenderTransform>. Estamos tomando a programação da Web como garantida agora ao fazer uma pergunta unicode?

— John

3

No Linux (Ubuntu) parece muito bom, mas quando eu uso o Windows, só consigo ver um quadrado.

— Eliasz Kubala 10/09

6

Isso significa neutro no sentido "nem masculino nem feminino". Se você usar um caractere apenas pelo glifo, é melhor colocá-lo em uma fonte atribuída em algum lugar da Área de Uso Privado ou usar um PNG, em vez de dizer "nem homem nem mulher" e aplicar um estilo para fazer parecer 🔍ou 🔎.

— Jon Hanna

1

Isso funcionou muito bem para mim. Eu fiz um <span class='icn icn-find'></span>então o css era

.icn-find:after { 				-webkit-transform: rotate(45deg); 				-moz-transform: rotate(45deg); 				-o-transform: rotate(45deg); 				transform: rotate(45deg); 				display: block; 				content: "\26B2"; 			}

. Funciona bem!

— teewuane

61

Eu recomendo usar http://shapecatcher.com/ para ajudar a procurar caracteres unicode. Ele permite que você desenhe a forma que deseja e depois lista as correspondências mais próximas dessa forma.

— john holt ripley
fonte

10

essa é uma ferramenta incrível. é principalmente encontrar Q os o quando eu tente procurar por uma lupa, mas ainda ... muito doce ferramenta

— redbmk

8

Encontrei lupa. Tente desenhar melhor: p

— vsync

1

Eu encontrei algumas boas imagens e caracteres aqui: charbase.com/block/miscellaneous-symbols-and-pictographs

— Sebastian

ferramenta muito boa, mas não encontra um ícone de lupa / pesquisa, nenhuma lista de caracteres e, infelizmente, não é atualizada desde 2012

— Mousey

30

Exibido correto no Chrome OS - capturas de tela deste sistema.

༗ U + 0F17

⌕ U + 2315

ᰄ U + 1C04

— Vitaly Zdanevich
fonte

postar o código do personagem? ele não exibir

— Mousey

1

@Mousey adicionou códigos e capturas de tela

— Vitaly Zdanevich 16/15

14

OMG, primeiro eu me perguntei por que você colocar um rabo tachado lá para uma solução ...

— Thomas Weller

Esta é a melhor resposta. A lupa parece incrível. Em 2018, todos os personagens unicode ficam confusos ao serem transformados em emojis. Eu usei-o como este para um formulário de pesquisa:#searchform:after { content: "\002315"; margin-left: -24px; }

— Ciprian

1

Obrigado. U + 2315 trabalhou em uma visualização de marcação baseada em xml do JSF (RichFaces) da seguinte maneira: <a4j: commandButton value = "# {someBooleanExpr? '& # X25bc;' : '& # x2315;'} "/>

— Lisa

6

Você pode simplesmente adicionar esse CSS ao seu cabeçalho

<link href='http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet' type='text/css'>

Em seguida, adicione esse código no local em que deseja exibir um símbolo de glifo.

<div class="fa fa-search"></div> <!-- smaller -->
<div class="fa fa-search fa-2x"></div> <!-- bigger -->

Diverta-se.

— Eliasz Kubala
fonte

1

Adicionar mais arquivos CSS ao cabeçalho diminui o carregamento da página. Os arquivos CSS estão bloqueando a renderização.

— Tinkerr 11/03/15

Você pode adicionar apenas parte importante deste arquivo se você se preocupa com a renderização.

— Eliasz Kubala

2

Contra-voto negativo, o uso de fontes css é realmente muito razoável, especialmente quando você precisa de mais e mais ícones.

— RR

Cheguei a esta página procurando um "ícone" que pudesse ser colocado em espaços reservados (dentro de um <input>); portanto, essa é apenas uma solução para os casos em que você pode usar HTML.

— Armfoot

Voto a favor para FontAwesome. Toneladas de glifos gratuitos para a web. Muito útil.

— PRMan