Como ele é
Parece um asteroide ou uma concha esculpida em lâminas finas, flutuando num céu claro. A forma tem bordas desfiadas e pontiagudas, em tons de ferrugem, rosa e verde-azulado, com sombras e brilho de sol nas faces. Ao fundo, o céu passa do azul-claro no alto para um creme quase branco embaixo, com os cantos levemente escurecidos. A escultura se retorce e pulsa devagar enquanto a câmera dá a volta nela; mover o mouse ou arrastar o dedo muda o ângulo de visão, com resposta suave. O fundo ocupa toda a área do elemento pai.
Você pode estar procurando isto se pediu algo assim
- fundo com uma escultura 3D abstrata girando no meio da tela
- aquele efeito de arte generativa que parece uma rocha se retorcendo
- fundo artístico em 3D para portfólio de designer
- forma orgânica flutuando num céu claro para abertura de evento
- fundo fractal que muda de ângulo quando mexo o mouse
- algo tipo instalação de arte digital no topo do site
Também chamado de
- raymarching
- fractal background
- fundo fractal
- escultura 3D generativa
- SDF shader
- arte generativa
- 3D fractal shader
Quando usar
- Peça artística ou página sobre arte digital e criatividade
- Portfólio de designer, artista 3D ou estúdio
- Abertura de evento, exposição ou festival
- Layout claro que precisa de um fundo marcante sem ser escuro
Quando evitar
- Celulares e notebooks modestos, porque o cálculo por pixel é muito pesado
- Páginas que já usam outro efeito em WebGL
- Seções com texto no centro, onde a escultura disputa a atenção
Como pedir para a sua IA
Crie um fundo em shader GLSL com raymarching de uma escultura fractal 3D no hero do portfólio: câmera girando devagar e respondendo ao mouse, cores da minha marca, pausa fora da tela, resolução reduzida no celular e imagem estática para movimento reduzido.
Com o THM Componentes, você cola o prompt completo do catálogo junto com o código deste componente, e a IA reproduz este efeito exato em vez de improvisar.
Perguntas sobre Stractium Background
O Stractium Background roda bem no celular?
Com cuidado. O Stractium Background calcula até 250 passos de raymarching por pixel, além de sombras e oclusão, e por isso é classificado como Pesado no THM Componentes. Ele já pausa fora da tela e renderiza em resolução 1x, mas no celular vale usar uma imagem estática ou pedir à IA para reduzir ainda mais a resolução.
O Stractium Background combina com site claro?
Combina. O Stractium Background é uma cena clara: o céu vai do azul-claro ao creme, e a escultura aparece em tons de ferrugem, rosa e verde-azulado no centro. As props hue, saturation e brightness ajustam a paleta, e speed controla o ritmo da animação.
Como o Stractium Background reage ao mouse?
No Stractium Background, a posição do mouse sobre o fundo define o ângulo da câmera: mover na horizontal dá a volta na escultura, e na vertical muda a altura do olhar. Por padrão a resposta é bem amortecida, então a vista gira devagar. No toque, arrastar o dedo gira a câmera e não rola a página.
