# Glass Cursor (React Bits Pro) — lente de vidro fosco que segue o ponteiro

Medido 2026-09-30 em `pro.reactbits.dev/docs/components/glass-cursor`: um shader WebGL
sobre uma foto (`src`), com metaballs de um rastro de até 40 pontos. Perfil radial da lente
assentada, contra a mesma cena sem cursor: refração forte até ~130 px do centro, clarão de
+15 a +22 níveis de 120 a 220 px, halo sumindo aos ~270 px; o miolo é **fosco** (desfoca e
desloca), com especular como arco na borda no alto à direita; em movimento a gota estica
num oval ao longo do caminho. A seta do sistema continua (`cursor: auto`).

- **Numa página real, o shader não enxerga o DOM.** Aplicado no ds2 como `backdrop-filter:
  url(#filtro) blur(3px) brightness(1.08)` num círculo fixo de 280 px (só Chromium; nos
  outros, fosco e aro), com um mapa de refração em domo gerado uma vez em canvas (fundo
  puxado ao centro, `s = r³`) e `feDisplacementMap` com `primitiveUnits=objectBoundingBox`,
  escala 0,3. O rastro vira uma cauda que persegue a cabeça em ~90 ms e estica a lente de
  cauda a cabeça; o aro contra-gira pelo mesmo ângulo para o especular ficar parado.
- **Armadilha paga:** `radial-gradient(circle …)` mede pela quina (`farthest-corner`, 1,41
  do raio). Numa máscara de anel dentro de um círculo com `border-radius: 50%`, o anel cai
  fora e some sem erro. Usar `circle closest-side`.
- Conota: uma lupa de vidro sobre o próprio texto — ler de perto, com a mão.
- Saiu do ds2 em 2026-10-01, trocado pelo Dither Cursor; mora no ReactIO como
  `library/src/components/GlassCursor/` (`cursor-de-vidro`), com a lente presa ao componente.