Carregando…

Dotted Glow Background

Backgrounds

Grid of dots glowing and dimming independently, with theme-aware color resolution — adapted from Aceternity UI.

Pontos que brilham e apagam organicamente

Instalação via CLI

$ npx kikitocn add dotted-glow-background

Interno:

@/lib/utils

Exemplo de uso

Dotted Glow BackgroundExample.tsx

import { DottedGlowBackground } from "@/components/ui/cn/dotted-glow-background/DottedGlowBackground";

export function DottedGlowBackgroundExample() {
  return (
    <DottedGlowBackground />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`className`	`string`	—	Classes CSS extras
`gap`	`number`	`12`	Distância entre pontos (px)
`radius`	`number`	`2`	Raio de cada ponto (px)
`color`	`string`	`'var(--ks-text)'`	Cor do ponto (aceita var(--...))
`glowColor`	`string`	`'var(--ks-patina)'`	Cor do glow no pico de brilho
`opacity`	`number`	`0.6`	Opacidade geral da camada
`backgroundOpacity`	`number`	`0`	Fade radial de fundo
`speedMin`	`number`	`0.4`	Velocidade mínima de pulsação
`speedMax`	`number`	`1.3`	Velocidade máxima de pulsação
`speedScale`	`number`	`1`	Multiplicador global de velocidade

Voltar para Backgrounds

Carregando…