PortuguêsPT

Lista de cursores CSS – tipos de cursor

Passe o mouse sobre um cartão para testar o cursor e clique para copiar o CSS.

Seus textos e arquivos não saem do navegador: nada é enviado para nenhum servidor.

Passe o mouse sobre um cartão para trocar para aquele cursor. Clique para copiar a linha de CSS.

Geral

Links e status

Seleção

Arrastar e soltar

Redimensionar e rolar

Zoom

Como usar

  1. Passe o mouse sobre qualquer cartão para ver o cursor em ação. A aparência muda um pouco conforme o sistema operacional e o navegador.
  2. Clique em um cartão para copiar “cursor: valor;” e cole na sua regra CSS.
  3. Digite uma palavra como resize ou move em “Buscar” para filtrar a lista.
  4. Celulares e tablets não têm cursor de mouse, então confira as prévias em um computador.

Perguntas frequentes

Posso usar minha própria imagem como cursor?

Pode: cursor: url(cursor.png) 4 4, pointer; — os dois números definem o ponto ativo (x y), e o valor padrão no fim é obrigatório como alternativa se a imagem falhar. Use uma imagem de 32×32 px ou menor.

Quando usar pointer e quando usar default?

Use pointer no que dá para clicar, como links e botões, e default em todo o resto. Um pointer em algo que não é clicável confunde quem está usando.

Por que o grab não aparece em alguns navegadores?

Navegadores muito antigos precisavam de prefixos como -webkit-grab, mas as versões atuais do Chrome, Edge, Firefox e Safari aceitam os valores padrão grab e grabbing.

Ferramentas relacionadas

Degradê CSSDegradês lineares, radiais e cônicosFiltros CSSDesfoque, brilho, tons de cinza e maisSeletor de coresHEX, RGB, HSL e CMYK em um só lugarEditor HTMLEscreva HTML, CSS e JS e veja ao vivo

Todas as ferramentas