Visualizador de cursores CSS

Visualizador de cursores CSS. Visualize cada estado aceitável para cursores de navegador. Passe o rato para experimentar, clique para copiar!

Descubra e teste instantaneamente todos os estilos de cursor de navegador disponíveis com o nosso visualizador de cursores CSS online gratuito. Este utilitário de design de IU premium aproveita as APIs nativas do navegador.

Para melhores resultados, reveja a saída antes de copiar ou transferir, especialmente quando ela será reutilizada em código, relatórios, documentação ou ficheiros partilhados.

Este fluxo no navegador mantém a tarefa rápida e ajuda a evitar limpezas manuais em aplicações separadas. Ferramentas relacionadas: Continue o fluxo com Analisador de URL, Codificador e Descodificador de URL, Extrator de URL / Domínio.

Estas ferramentas relacionadas ajudam em tarefas próximas de conversão, formatação, validação, geração e limpeza.

Perguntas frequentes

Como testo e copio um valor de cursor CSS?

Passe o rato sobre um mosaico para ver esse cursor; o nome no mosaico é o valor CSS. Clique no mosaico (ou prima Enter) para o selecionar e copiar a declaração, por exemplo cursor: grab;. O painel Cursor selecionado mostra uma descrição, uma área de teste e um botão Copiar CSS.

Que cursor CSS mostra a mão?

Use cursor: pointer; em links e elementos clicáveis; mostra a mão. Use grab e grabbing em itens arrastáveis, not-allowed em controlos desativados, text para o cursor de texto em I, e wait ou progress para estados de espera.

Como encontro rapidamente um tipo de cursor?

Escreva na caixa de pesquisa para filtrar por nome ou descrição, por exemplo drag, resize ou zoom, ou use os botões de categoria: Geral, Links e estado, Seleção, Arrastar e soltar, Redimensionar e rolar e Zoom. O contador mostra quantos dos 36 cursores correspondem.

Como crio um cursor personalizado com uma imagem?

Em Gerador de CSS para cursor personalizado, cole um URL de imagem ou data URI (PNG, SVG ou CUR), defina, se quiser, Ponto ativo X e Ponto ativo Y em píxeis (0 a 127) e escolha um Cursor alternativo. A ferramenta cria uma regra como cursor: url("cursor.png") 16 16, pointer; que pode testar na área de pré-visualização e copiar.

Porque é que a imagem do meu cursor personalizado não aparece?

Os navegadores ignoram imagens de cursor maiores do que 128 por 128 píxeis, por isso 32 por 32 é o tamanho mais seguro. O URL da imagem também tem de carregar a partir da página onde a usa. Quando a imagem não pode ser usada, é mostrado o cursor alternativo.

Porque é que alguns cursores parecem iguais ou diferentes no meu computador?

As palavras-chave de cursor são desenhadas pelo sistema operativo, por isso o mesmo valor pode ter aspeto diferente no Windows, macOS e Linux, e alguns sistemas reutilizam uma imagem para vários valores. Os dispositivos táteis nem sequer mostram cursor de rato.

Como usar esta ferramenta online

Com Visualizador de cursores CSS, você pode formatar, validar, converter, decodificar, codificar, gerar ou inspecionar dados rapidamente no navegador, sem abrir um aplicativo pesado. Comece pelo campo de entrada ou pelas opções visíveis, revise o resultado e copie ou baixe a saída.

Processamento privado no navegador

Visualizador de cursores CSS mantém o processamento normal localmente no seu navegador. Isso ajuda com trechos de código, tokens, documentos, valores de configuração, textos e outros materiais que não devem ser enviados a um serviço remoto sem necessidade.

Quando esta ferramenta é útil

Use Visualizador de cursores CSS para tarefas repetitivas de desenvolvimento, documentação técnica, verificações de QA, conversões rápidas, depuração, limpeza de conteúdo e fluxos internos de equipe. A página prioriza entradas claras, retorno imediato e uma saída fácil de reutilizar.

Dicas práticas

Antes de copiar o resultado final, confira detalhes como espaços, maiúsculas, nomes de arquivo, codificação, estrutura de tokens, quebras de linha ou formato de saída. Pequenas verificações evitam erros em código, relatórios, tickets, e-mails ou notas técnicas.