PremiumComponenteDemo

Botão Arco-Íris

Borda em degradê de cinco cores que desliza

Demonstração interativa

Sobre

Botão com borda em degradê de cinco cores em movimento contínuo e um brilho colorido por baixo. Variações em miolo escuro e claro, e cores configuráveis.

#arco-íris #degradê #borda animada #cta

Detalhes

Categoria: Botões
Tipo: Componente
Framework: React
Tecnologias: React, CSS
Publicado em: 27 de outubro de 2026
Base: Adaptado de Rainbow Button · Magic UI (licença MIT)

Dependências e requisitos

react>=18
Biblioteca de interface.

Projeto React 18+. Não depende de Tailwind.

Arquivos incluídos

components/integra/botao-arco-iris.tsxtsx

Como usar

import BotaoArcoIris from "@/components/integra/botao-arco-iris";

<BotaoArcoIris>Começar grátis</BotaoArcoIris>

Copiar e integrar

Recurso premium. A demonstração é aberta; o código, os prompts e os arquivos fazem parte da assinatura.

Código
Todos os arquivos, com o caminho de cada um.
Claude Code
Tarefa em passos para o agente executar no terminal.
Cursor
Instruções para o modo Agent do Cursor.
Codex
Especificação de tarefa com critérios de aceite.
Lovable
Prompt para o chat do Lovable (Vite + React).

Recursos semelhantes

Ver biblioteca

Botão Arco-Íris

Sobre

Detalhes

Dependências e requisitos

Arquivos incluídos

Como usar

Recursos semelhantes

Botão Brilho Orbital

Botão Pulsante

Botão com Seta no Hover

Botão Arco-Íris

Sobre

Detalhes

Dependências e requisitos

Arquivos incluídos

Como usar

Recursos semelhantes

Botão Brilho Orbital

Botão Pulsante

Botão com Seta no Hover